Tag: next.js

Auto start Next.js with supervisor
I want to start Next.js development server on my computer when it starts. Usually, this is done using pm2, I wanted to do it with supervisors.

Install supervisor with command
```
apt install -y supervisor
```
Create file
```
vi /etc/supervisor/conf.d/nextjs-todo.conf 
```
My Next.js application is located in the directory /mnt/data/sites/learn/nextjs/todo, so I used the following configuration
```
[program:nextjs-todo]
priority=200
directory=/mnt/data/sites/learn/nextjs/todo
command=npm run dev
user=boby
autorestart=true
autostart=true
redirect_stderr=true
```
In the file change “user=boby” to whatever username you want the application to run as.

To start the application, run
```
supervisorctl reload
```
To see the application status, run
```
boby@sok-01:~$ sudo supervisorctl status
nextjs-todo                      RUNNING   pid 32604, uptime 0:07:49
boby@sok-01:~$ 
```
Back to supervisord
October 30, 2022

How to change Next.js port

You can start Next.js development server with the command

npm run dev

This will start the development server on port 3000.

boby@sok-01:/www/learn/nextjs/todo (main)$ npm run dev

> dev
> next dev

ready - started server on 0.0.0.0:3000, url: http://localhost:3000
event - compiled client and server successfully in 1645 ms (163 modules)
wait  - compiling...
event - compiled client and server successfully in 59 ms (163 modules)
wait  - compiling / (client and server)...
event - compiled client and server successfully in 900 ms (183 modules)

If port 3000 is already used on your system, next.js will try to use another available port. If you want to assign a fixed port for your Next.js application, you can specify a port.

Next.js change port

To change the port, edit file package.json

In the file, find

  "scripts": {
    "dev": "next dev",
    "build": "next build",
    "start": "next start"
  },

Replace with

  "scripts": {
    "dev": "next dev -p 8001",
    "build": "next build",
    "start": "next start"
  },

This will change the next.js application port to 8001.

If you only want to change one time, you can specify the port when you run “npm run dev” as follows.

PORT=8081 npm run dev

This will run the next.js application on port 8081.

Another way to do the same is

npm run  dev -- --port 8081

Example.

boby@sok-01:/www/learn/nextjs/todo (main)$ npm run  dev -- --port 8081

> dev
> next dev --port 8081

ready - started server on 0.0.0.0:8081, url: http://localhost:8081
event - compiled client and server successfully in 436 ms (163 modules)
wait  - compiling...
event - compiled client and server successfully in 639 ms (163 modules)

See npm

October 30, 2022

Tag: next.js

Auto start Next.js with supervisor

How to change Next.js port

Next.js change port