How to run nextjs 13 application on a different port number ?

Опубликовано: 17 Август 2023
на канале: Ghulam Hussain
884
17

How to change port in react js? ReactJS app created with create-react-app has got default PORT that is 3000. App runs at 3000 port. What if some other program is already using same PORT? Or you may want to change port for project's specific need. How can we change port for ReactJS app?

It is very easy. We can change reactJS app port in multiple ways. One way is to use .env file
.env is an environment variable file and is hidden. It is treated as system file. Create .env file if it's not already there at project root level and specify port number there.

Restart the app and your app will be using specified port. You can also use package.json file to add custom start command for ReactJS app with new port information.

Original Start Command
"start": "react-scripts start"
Change it to
"start": "set PORT=9001 && react-scripts start"

In my opinion, using .env file to change port is cleaner way to change project port.

🏢 LinkedIn:   / 3998411  
➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖
📞WhatApp: https://chat.whatsapp.com/6tSVUlX2ltC...
➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖
📚 Facebook:   / gmkhussain  
➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖
💗 Instagram:   / gmkhussain  
➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖
📻 YouTube:   / gmkhussain  
➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖
🐦 Twitter:   / gmkhussain  
➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖ ➖
❎ No Negative Comments