How to change the default port number in Create React app

In this tutorial, we are going to learn about how to change the default port number in a create-react-app.

If we create a new project using create-react-app (CLI), by default the react app runs on port 3000.

Changing the port number

To change the port number, first we need to install a new package called cross-env which helps to set environment variables across all platforms (like windows, mac, linux, etc).

npm install -D cross-env

Now, open your package.json file and add the following line inside the scripts object by specifying your port number.

"start": "cross-env PORT=4006 react-scripts start",

Here I set a PORT environment variable to 4006 using cross-env, so that my react app runs on port 4006.