How to change ReactJS Localhost port!

How to change ReactJS Localhost port!

Written by Adam. R on Sep 28th, 2021 ・ Views ・ Report Post

Adam. R Visit User Profile
Table of contents

I have seen that the How to change Next.JS Localhost port post did very well. I have decided now to do ReactJS as it is similar to NextJS!

The Process

To change the default port of 3000 it is a bit different then doing it for NextJS. But it is still possible! Lets begin!

You must already have a react project made. But if you don't make sure you have NodeJS installed. Just type the following command in your terminal:

npx create-react-app

Make sure you do this in your project directory.

Once installed find the package.json folder.

Find the line:

 "scripts": {
    "start": "react-scripts start",
    "build": "react-scripts build",
    "test": "react-scripts test",
    "eject": "react-scripts eject"
  },

Then change the "start" line change it to the following:

"start": "set PORT=80 && react-scripts start",

Now just run the following command in your terminal:

npm run start

You may be automatically opened with localhost. But as you see there is no :3000 or any port number. Broswers remove the :80 by default. localhost.png.

🤩 Our Amazing Sponsors 👇
DigitalOcean View Website
DigitalOcean offers a simple and reliable cloud hosting solution that enables developers to get their website or application up and running quickly.
Laravel News View Website
Laravel News keeps you up to date with everything Laravel. Everything from framework news to new community packages, Laravel tutorials, and more.
Genesis View Website
A Laravel Starter Kit that includes Authentication, User Dashboard, Edit Profile, and a set of UI Components.

If you found this usful then please share this and follow me! Also check out my website where I also post everything from here

Comments (0)