Create a web application with Express.js and React.js

Photo by Christopher Gower on Unsplash

To create a web application with Express.js and React.js, you’ll need to create two separate projects: a React project for the front-end (client-side) and an Express project for the back-end (server-side).

Here is a step-by-step guide to create a simple web application.

Step 1: Setting up the Back-End with Express.js

1.1. First, install Node.js and npm if you haven’t already. You can download it from the [official Node.js website](https://nodejs.org/en/download/).

1.2. Create a new directory for your project and initialize a new Node.js application:

$ mkdir express-backend
$ cd express-backend
$ npm init -y

1.3. Install Express:

$ npm install express

1.4. Create a new file, such as `index.js`, and setup a basic Express server:

const express = require('express');
const app = express();
const port = 3001;
app.get('/api', (req, res) => {
 res.json({ message: 'Hello from server!' });
});
app.listen(port, () => {
 console.log(`Server is running on http://localhost:${port}`);
});

This sets up a server that responds with “Hello from server!” when a GET request is made to the `/api` endpoint.