Production

Deployment

Deploy your Next.js app to Vercel, or self-host with Docker and other platforms.

Deploying to Vercel

Vercel is the company behind Next.js and offers the best deployment experience:

  1. Push your code to GitHub
  2. Connect your repo to Vercel
  3. Every push to main auto-deploys

Vercel handles: serverless functions, edge functions, CDN, SSL, and more.

Build Output

bash
npm run build

Creates an optimized production build. Next.js automatically:

  • Splits code per route
  • Pre-renders static pages
  • Optimizes images
  • Minifies JavaScript

Environment Variables

Set environment variables in:

  • .env.local — local development (never commit)
  • Vercel dashboard — production secrets
  • .env.production — non-sensitive production values

Variables prefixed with NEXT_PUBLIC_ are available in the browser.

Example

bash
# Install dependencies
npm install

# Development server
npm run dev

# Production build
npm run build

# Start production server
npm start

# .env.local (never commit to git)
# DATABASE_URL=postgresql://...
# SECRET_KEY=your-secret-here
# NEXT_PUBLIC_API_URL=https://api.example.com

# Access env vars in code
const dbUrl = process.env.DATABASE_URL;          // server only
const apiUrl = process.env.NEXT_PUBLIC_API_URL;  // client + server

# Dockerfile for self-hosting
FROM node:20-alpine AS builder
WORKDIR /app
COPY . .
RUN npm ci && npm run build

FROM node:20-alpine AS runner
WORKDIR /app
COPY --from=builder /app/.next ./.next
COPY --from=builder /app/public ./public
COPY --from=builder /app/package.json .
RUN npm install --production
EXPOSE 3000
CMD ["npm", "start"]
Try it yourself — BASH