Shipping a Next.js application to production involves far more than running a single command. This tutorial walks through everything from preparing your codebase to choosing a hosting strategy, securing your app, and keeping it observable once it's live. Whether you're deploying to Vercel, a Docker container, or a Kubernetes cluster, you'll find a practical, production-ready path here.

📖 1. Introduction

Next.js supports multiple deployment models: fully managed platforms, self-hosted Node.js servers, containerized environments, and static exports. The right choice depends on your app's rendering strategy (SSR, SSG, ISR, or Edge), team expertise, and infrastructure constraints.

🧰 2. Preparing for Deployment

Before deploying, audit your project for production-readiness. This includes dependency hygiene, environment configuration, and verifying that your app builds cleanly.

🏗️ 3. Production Build

Next.js compiles your application into an optimized production bundle using the build command. This process performs code splitting, minification, static generation, and prerendering where possible.

npm run build
# or
pnpm build
# or
yarn build

After building, start the optimized server locally to verify everything works as expected:

npm run start

✅ 4. Production Checklist

Use this checklist before pushing to production to catch common oversights.

▲ 5. Vercel Deployment

Vercel is the creator of Next.js and offers zero-configuration deployment with automatic CI/CD, edge caching, and preview URLs for every pull request.

npm i -g vercel
vercel login
vercel --prod

🖥️ 6. Self-Hosting

Self-hosting gives you full control over infrastructure, at the cost of managing servers, scaling, and updates yourself. Next.js supports three self-hosting strategies:

🟢 7. Node.js Deployment

The simplest self-hosted approach runs Next.js as a long-lived Node.js process behind a process manager.

npm run build
npm run start -- -p 3000

For production resilience, use a process manager like pm2 to handle crashes, restarts, and clustering.

npm i -g pm2
pm2 start npm --name "next-app" -- start
pm2 save
pm2 startup

🐳 8. Docker Deployment

Containerizing your Next.js app ensures consistent environments across development, staging, and production.

FROM node:20-alpine AS deps
WORKDIR /app
COPY package.json package-lock.json ./
RUN npm ci

FROM node:20-alpine AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .
RUN npm run build

FROM node:20-alpine AS runner
WORKDIR /app
ENV NODE_ENV=production
COPY --from=builder /app/.next/standalone ./
COPY --from=builder /app/.next/static ./.next/static
COPY --from=builder /app/public ./public
EXPOSE 3000
CMD ["node", "server.js"]

docker build -t next-app .
docker run -p 3000:3000 next-app

☸️ 9. Kubernetes Deployment

For applications requiring horizontal scaling, self-healing, and rolling updates, Kubernetes orchestrates your containerized Next.js app across a cluster of nodes.

apiVersion: apps/v1
kind: Deployment
metadata:
  name: next-app
spec:
  replicas: 3
  selector:
    matchLabels:
      app: next-app
  template:
    metadata:
      labels:
        app: next-app
    spec:
      containers:
        - name: next-app
          image: your-registry/next-app:latest
          ports:
            - containerPort: 3000
          env:
            - name: NODE_ENV
              value: "production"
          resources:
            requests:
              cpu: "250m"
              memory: "256Mi"
            limits:
              cpu: "500m"
              memory: "512Mi"

apiVersion: v1
kind: Service
metadata:
  name: next-app-service
spec:
  selector:
    app: next-app
  ports:
    - port: 80
      targetPort: 3000
  type: LoadBalancer

📦 10. Static Export

If your app has no server-side requirements (no API routes, no dynamic SSR), you can export it as fully static HTML, deployable to any static host or CDN.

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: "export",
};

module.exports = nextConfig;

npm run build
# Output is generated in the "out" directory

🌐 11. Edge Deployment

Edge runtimes execute code close to the user, reducing latency for personalization, authentication checks, and lightweight rendering logic.

export const runtime = "edge";

export async function GET(request) {
  return new Response("Hello from the edge!");
}

⚡ 12. Serverless Deployment

Serverless functions scale automatically and charge per invocation, making them cost-effective for variable traffic patterns. Platforms like Vercel, AWS Lambda, and Netlify Functions all support this model natively for Next.js.

🔑 13. Environment Variables

Next.js loads environment variables from .env files at build and runtime. Variables prefixed with NEXT_PUBLIC_ are exposed to the browser; all others remain server-only.

DATABASE_URL=postgres://user:pass@host:5432/db
NEXT_PUBLIC_API_URL=https://api.example.com
SESSION_SECRET=your-secret-here

🌍 14. Domains

Once deployed, point a custom domain at your hosting provider by updating DNS records.

🔒 15. HTTPS & SSL

Serving your app over HTTPS is non-negotiable for production. Most managed platforms provision SSL certificates automatically via Let's Encrypt.

For self-hosted deployments, tools like certbot automate certificate issuance and renewal:

sudo certbot --nginx -d example.com -d www.example.com

🌩️ 16. CDN Integration

A CDN caches static assets and, in some setups, full pages, at edge locations worldwide, reducing latency and origin load.

🔀 17. Reverse Proxy

A reverse proxy sits in front of your Next.js server, handling SSL termination, load balancing, and routing to multiple backend instances.

⚙️ 18. Nginx Configuration

A minimal Nginx configuration proxies incoming requests to your Node.js process running on a local port.

server {
  listen 80;
  server_name example.com www.example.com;

  location / {
    proxy_pass http://localhost: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;
  }
}

🏎️ 19. Performance Optimization

Production performance depends on how well you leverage Next.js's built-in optimization features.

🛡️ 20. Security Best Practices

📊 21. Monitoring

Monitoring gives you visibility into your app's health: response times, error rates, and resource usage.

📝 22. Logging

Structured logs make debugging production issues far easier than scattered console.log calls.

console.log(JSON.stringify({
  level: "info",
  message: "User logged in",
  userId: user.id,
  timestamp: new Date().toISOString(),
}));

📈 23. Analytics

Analytics track user behavior and business metrics, distinct from performance monitoring. Popular options include Vercel Analytics, Google Analytics, and Plausible.

🔄 24. CI/CD Pipelines

A CI/CD pipeline automates testing, building, and deploying your app whenever code changes.

🐙 25. GitHub Actions

GitHub Actions can automate builds and deployments directly from your repository.

name: Deploy Next.js App

on:
  push:
    branches: [main]

jobs:
  build-and-deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4

      - uses: actions/setup-node@v4
        with:
          node-version: "20"

      - name: Install dependencies
        run: npm ci

      - name: Run tests
        run: npm test

      - name: Build application
        run: npm run build

      - name: Deploy
        run: npx vercel --prod --token=${{ secrets.VERCEL_TOKEN }}

🏷️ 26. Versioning

Tag each production release to maintain a clear history and enable quick rollbacks.

git tag -a v1.4.0 -m "Release 1.4.0: add checkout flow"
git push origin v1.4.0

↩️ 27. Rollbacks

Even with careful testing, production issues happen. A fast rollback strategy minimizes downtime.

🐛 28. Common Deployment Issues

❓ 29. Frequently Asked Questions

📌 30. Summary

Deploying a Next.js application successfully means matching your rendering strategy to the right hosting model, securing the app with HTTPS and proper headers, automating releases through CI/CD, and maintaining visibility through monitoring and logging once live.