dhairyashah
Portfolio

Mar 19th, 2022

How to change the development server port in Next.js

Author Picture

Dhairya Shah

Software Engineer

Introduction

When running up the Next.js application locally, by default the application will run on port 3000 and that’s a very commonly used port.

Now the question arises, how to change the server port?

Changing the port

The answer to the question is package.json inside the Next.js application folder.

By default, this is how your package.json looks,

{
  "name": "change-port-app",
  "version": "0.1.0",
  "private": true,
  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },
  "dependencies": {
    "next": "9.3.5",
    "react": "16.13.1",
    "react-dom": "16.13.1"
  }
}

The thing you need to change is in scripts,

"dev": "next dev",

to:

"dev": "next dev -p 2000"

Now the port has changed to 3000 —> 2000

Conclusion

I hope this article was helpful to you! Thank you for reading!

Let’s connect

Have a great day!