How to Deploy a Next.js Application on a VPS

What Is Next.js?

Next.js is a React framework that enables server-side rendering, static site generation, and API routes out of the box. It is ideal for building fast, SEO-friendly web applications that can be self-hosted on your Breeze.

Prerequisites

• A Breeze running Ubuntu 22.04 or later
• Node.js 18+ and npm installed
• Nginx installed as a reverse proxy
• A domain name pointed to your Breeze

Step 1: Build Your Application

Transfer your project to the server and install dependencies:

cd /var/www/myapp
npm install
npm run build

Step 2: Run with PM2

Use PM2 to keep your Next.js app running in the background:

sudo npm install -g pm2
pm2 start npm --name "nextjs-app" -- start
pm2 save
pm2 startup

Step 3: Configure Nginx Reverse Proxy

server {
    listen 80;
    server_name yourdomain.com;

    location / {
        proxy_pass http://127.0.0.1:3000;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection 'upgrade';
        proxy_set_header Host $host;
        proxy_cache_bypass $http_upgrade;
    }
}

sudo ln -s /etc/nginx/sites-available/nextjs /etc/nginx/sites-enabled/
sudo nginx -t
sudo systemctl reload nginx

Step 4: Enable SSL

sudo certbot --nginx -d yourdomain.com

Environment Variables

Store production environment variables in a .env.production file in your project root. Next.js will load them automatically during the build step. Restart PM2 after any changes with pm2 restart nextjs-app.