Serve nextJS app from a port through NGINX reverse proxy HTTP and HTTPS

default HTTP

# Serve nextJS app from a port through NGINX reverse proxy (HTTP)
# Path: /etc/nginx/sites-available/default
# Default server configuration for HTTP

server {
    server_name www.DOMAINNAME.com DOMAINNAME.com;

    # Serve any static assets with NGINX
    location /_next/static {
        alias /home/ubuntu/PROJECT_FOLDER/.next/static;
        add_header Cache-Control "public, max-age=3600, immutable";
    }

    location / {
        try_files $uri.html $uri/index.html # only serve html files from this dir
        @public
        @nextjs;
        add_header Cache-Control "public, max-age=3600";
    }

    location @public {
        add_header Cache-Control "public, max-age=3600";
    }

    location @nextjs {
        # reverse proxy for next server
        proxy_pass http://localhost:8080; #Don't forget to update your port number
        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;
    }

    listen 80 default_server;
    listen [::]:80;
}

default HTTPS

# Serve nextJS app from a port through NGINX reverse proxy (HTTPS)
# Path: /etc/nginx/sites-available/default
# Default server configuration for HTTPS

server {
    server_name www.DOMAINNAME.com DOMAINNAME.com;

    # Serve any static assets with NGINX
    location /_next/static {
        alias /home/ubuntu/PROJECT_FOLDER/.next/static;
        add_header Cache-Control "public, max-age=3600, immutable";
    }

    location / {
        try_files $uri.html $uri/index.html # only serve html files from this dir
        @public
        @nextjs;
        add_header Cache-Control "public, max-age=3600";
    }

    location @public {
        add_header Cache-Control "public, max-age=3600";
    }

    location @nextjs {
        # reverse proxy for next server
        proxy_pass http://localhost:8080; #Don't forget to update your port number
        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;
    }

    listen [::]:443 ssl ipv6only=on;
    listen 443 ssl default_server;

    # Update with your SSL files. This is certbot genrated SSL details
    # Steps to generate cerbot SSL https://certbot.eff.org/lets-encrypt/ubuntufocal-nginx
    ssl_certificate /etc/letsencrypt/live/SOME_PROJECT_NAME/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/SOME_PROJECT_NAME/privkey.pem;
    include /etc/letsencrypt/options-ssl-nginx.conf;
    ssl_dhparam /etc/letsencrypt/ssl-dhparams.pem;

}

server {
    if ($host = www.DOMAINNAME.com) {
        return 301 https://$host$request_uri;
    }

    if ($host = DOMAINNAME.com) {
        return 301 https://$host$request_uri;
    }

    listen 80 ;
    listen [::]:80 ;
    server_name www.DOMAINNAME.com DOMAINNAME.com;
    return 301 https://$host$request_uri;
}

support.sh

# Test Nginx config
sudo nginx -t

# If you got error then just delete the log.txt file then
sudo nginx -s reload

# Status
sudo systemctl status nginx

# start
sudo systemctl start nginx

# Restart 
sudo systemctl restart nginx

# Stop 
sudo systemctl stop nginx

# Nginx Security 
sudo ufw app list

sudo ufw allow 'Nginx Full'



# Port verification 
sudo lsof -i TCP:80


#for SSH
# https://www.nginx.com/blog/using-free-ssltls-certificates-from-lets-encrypt-with-nginx/

Thank you very much, will try with NextJS 14 and App Router!

Thank you very much, will try with NextJS 14 and App Router!

@YoSoyPhil have you tried this with NextJS 14?

Thank you very much, will try with NextJS 14 and App Router!

@YoSoyPhil have you tried this with NextJS 14?

I did, here is a snippet of my virtualhost

    # Strapi static uploads
    location /uploads {
        alias /home/strapi/public/uploads;
        add_header Cache-Control "public, max-age=3600, immutable";
    }

    # Serve any static assets with NGINX
    location /_next/static {
        alias /home/next/.next/static;
        add_header Cache-Control "public, max-age=3600, immutable";
    }

You might also need to look at your middleware and make sure you skip paths properly @abdulqadeer1992