When I first started learning web development, I found terms like static site, dynamic site, server-side rendering and single-page application quite confusing. It wasn’t clear to me what the differences were and exactly how many ways there were to render a web page. In this article I would like to look at the different ways that websites can be assembled and delivered to the browser and clarify some of the associated terminology.

Note: a good place to try out the examples in this article and experiment with regexes is Regex101. INTRODUCTION Regular expressions (or ‘regexes’) are a kind of code you can use to target certain words or characters in some text. For example, if you want to find all instances of the word “JavaScript”, you could use this regular expression: /JavaScript/ At its most basic, a regex is just some characters between two forward slashes.

We’re going to learn how to build and deploy a MERN-stack app (MongoDB, Express, React, Node) for free to Heroku. For this example, we’ll build a simple app where the user can add the name of a country and the capital city and this information will be displayed in a table. You can find the source code here. If you already have a MERN app ready to deploy, you can use that but you’ll need to make a number of small changes to your code.

We’re going to look at how to implement sliding page transitions in a React app. The application will have three pages which the user can navigate between using arrows. These page changes will be animated - appearing to slide in and out of view. You can find the source code here. To help us achieve our goals, we’ll be using the react-transition-group library for this project. Let’s start by creating a new React project with create-react-app:

Setting up a server in Node using the Express framework is very straightforward. First of all, you need to make sure you have Node installed on your computer. If you’re not sure you have it installed, you can check by entering this command in the terminal: node -v If you have Node installed, this will tell you the version. If you don’t, you’ll see an error and then you should download it.