Alternative Deployment Options

[build]
  command = "npm run build"
  publish = ".next"

[[plugins]]
  package = "@netlify/plugin-nextjs"

[build.environment]
  NODE_VERSION = "18"

# Redirects
[[redirects]]
  from = "/old-page"
  to = "/new-page"
  status = 301

# Headers
[[headers]]
  for = "/*"
  [headers.values]
    X-Frame-Options = "DENY"
    X-Content-Type-Options = "nosniff"

# ✅ Next.js plugin for full support
# ✅ Configure build settings
# ✅ Redirects and headers

# Features supported:
✅ Static Site Generation (SSG)
✅ Incremental Static Regeneration (ISR)
✅ API Routes (Netlify Functions)
✅ Image Optimization (with plugin)
✅ Middleware (limited support)
⚠️ Server-Side Rendering (requires plugin)

# Install Next.js plugin:
npm install @netlify/plugin-nextjs

# Plugin provides:
# - SSR support
# - ISR support
# - Middleware support
# - Image optimization

# ✅ Good Next.js support
# ✅ Easy setup
# ⚠️ Some limitations vs Vercel

version: 1
frontend:
  phases:
    preBuild:
      commands:
        - npm ci
    build:
      commands:
        - npm run build
  artifacts:
    baseDirectory: .next
    files:
      - '**/*'
  cache:
    paths:
      - node_modules/**/*
      - .next/cache/**/*

# ✅ Similar to Vercel
# ✅ Git-based deployments
# ✅ Environment variables in console

# 1. Launch EC2 instance (Ubuntu)
# 2. SSH into instance
ssh -i your-key.pem ubuntu@your-instance-ip

# 3. Install Node.js
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt-get install -y nodejs

# 4. Install PM2 (process manager)
sudo npm install -g pm2

# 5. Clone repository
git clone https://github.com/username/your-app.git
cd your-app

# 6. Install dependencies
npm install

# 7. Build application
npm run build

# 8. Start with PM2
pm2 start npm --name "next-app" -- start

# 9. Save PM2 configuration
pm2 save
pm2 startup

# 10. Configure Nginx as reverse proxy
sudo apt install nginx
sudo nano /etc/nginx/sites-available/default

# Nginx config:
server {
    listen 80;
    server_name your-domain.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;
    }
}

# 11. Restart Nginx
sudo systemctl restart nginx

# ✅ Full control
# ✅ All Next.js features
# ⚠️ Manual server management

# Use AWS ECS (Elastic Container Service)
# 1. Create Docker image (see Docker section)
# 2. Push to AWS ECR (Elastic Container Registry)
# 3. Create ECS Task Definition
# 4. Deploy to ECS Cluster

# AWS CLI commands:
# Build and tag
docker build -t my-next-app .

# Tag for ECR
docker tag my-next-app:latest \
  123456789.dkr.ecr.us-east-1.amazonaws.com/my-next-app:latest

# Login to ECR
aws ecr get-login-password --region us-east-1 | \
  docker login --username AWS --password-stdin \
  123456789.dkr.ecr.us-east-1.amazonaws.com

# Push to ECR
docker push 123456789.dkr.ecr.us-east-1.amazonaws.com/my-next-app:latest

# ✅ Scalable containers
# ✅ Load balancing
# ✅ Auto-scaling

/** @type {import('next').NextConfig} */
const nextConfig = {
  // Standalone output for Docker
  output: 'standalone',
  
  // Your other config
  reactStrictMode: true,
  images: {
    remotePatterns: [
      {
        protocol: 'https',
        hostname: 'cdn.example.com',
      },
    ],
  },
};

module.exports = nextConfig;

// ✅ Standalone creates self-contained build
// ✅ Minimal dependencies
// ✅ Smaller Docker image

# Multi-stage build for smaller image
FROM node:18-alpine AS base

# Install dependencies only when needed
FROM base AS deps
RUN apk add --no-cache libc6-compat
WORKDIR /app

# Install dependencies
COPY package.json package-lock.json ./
RUN npm ci

# Rebuild the source code only when needed
FROM base AS builder
WORKDIR /app
COPY --from=deps /app/node_modules ./node_modules
COPY . .

# Build Next.js
RUN npm run build

# Production image
FROM base AS runner
WORKDIR /app

ENV NODE_ENV production

RUN addgroup --system --gid 1001 nodejs
RUN adduser --system --uid 1001 nextjs

# Copy necessary files
COPY --from=builder /app/public ./public
COPY --from=builder --chown=nextjs:nodejs /app/.next/standalone ./
COPY --from=builder --chown=nextjs:nodejs /app/.next/static ./.next/static

USER nextjs

EXPOSE 3000

ENV PORT 3000
ENV HOSTNAME "0.0.0.0"

CMD ["node", "server.js"]

# ✅ Multi-stage build (smaller image)
# ✅ Non-root user (security)
# ✅ Only production dependencies
# ✅ Standalone output

# Don't copy to Docker image
node_modules
.next
.git
.gitignore
README.md
.env*.local
.vscode
.DS_Store
npm-debug.log*
yarn-debug.log*
yarn-error.log*

# ✅ Smaller image
# ✅ Faster builds
# ✅ No sensitive files

version: '3.8'

services:
  nextjs:
    build:
      context: .
      dockerfile: Dockerfile
    ports:
      - "3000:3000"
    environment:
      - NODE_ENV=production
      - DATABASE_URL=${DATABASE_URL}
      - API_SECRET_KEY=${API_SECRET_KEY}
    restart: unless-stopped
    
  # Optional: Database
  postgres:
    image: postgres:15-alpine
    environment:
      POSTGRES_USER: user
      POSTGRES_PASSWORD: password
      POSTGRES_DB: mydb
    volumes:
      - postgres-data:/var/lib/postgresql/data
    ports:
      - "5432:5432"
    
volumes:
  postgres-data:

# Run with:
# docker-compose up -d

# ✅ Multi-container setup
# ✅ Database included
# ✅ Environment variables
# ✅ Production-ready

# Build Docker image
docker build -t my-next-app .

# Run container
docker run -p 3000:3000 my-next-app

# With environment variables
docker run -p 3000:3000 \
  -e DATABASE_URL="postgresql://..." \
  -e API_KEY="secret" \
  my-next-app

# Using docker-compose
docker-compose up -d

# View logs
docker logs -f <container-id>

# Stop container
docker-compose down

# ✅ Consistent environment
# ✅ Easy deployment
# ✅ Portable containers

# Server requirements:
# - Ubuntu/Debian Linux
# - Node.js 18+
# - PM2 (process manager)
# - Nginx (reverse proxy)
# - SSL certificate (Let's Encrypt)

# ✅ Full control
# ✅ All Next.js features
# ⚠️ Requires server management knowledge

# 1. Update system
sudo apt update && sudo apt upgrade -y

# 2. Install Node.js
curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt-get install -y nodejs

# 3. Install PM2
sudo npm install -g pm2

# 4. Install Nginx
sudo apt install nginx -y

# 5. Install Certbot (for SSL)
sudo apt install certbot python3-certbot-nginx -y

# ✅ Production-ready server
# ✅ Process management
# ✅ Reverse proxy
# ✅ SSL certificates

# 1. Clone repository
cd /var/www
sudo git clone https://github.com/username/my-app.git
cd my-app

# 2. Install dependencies
npm install

# 3. Build application
npm run build

# 4. Create PM2 ecosystem file
cat > ecosystem.config.js << EOF
module.exports = {
  apps: [{
    name: 'next-app',
    script: 'npm',
    args: 'start',
    env: {
      NODE_ENV: 'production',
      PORT: 3000,
    },
  }],
};
EOF

# 5. Start with PM2
pm2 start ecosystem.config.js

# 6. Save PM2 config
pm2 save

# 7. Setup PM2 startup
pm2 startup
# Follow instructions to run generated command

# ✅ Application running
# ✅ Auto-restart on crash
# ✅ Runs on server boot

server {
    listen 80;
    server_name yourdomain.com www.yourdomain.com;
    
    # Redirect HTTP to HTTPS
    return 301 https://$server_name$request_uri;
}

server {
    listen 443 ssl http2;
    server_name yourdomain.com www.yourdomain.com;
    
    # SSL certificates (managed by Certbot)
    ssl_certificate /etc/letsencrypt/live/yourdomain.com/fullchain.pem;
    ssl_certificate_key /etc/letsencrypt/live/yourdomain.com/privkey.pem;
    
    # Security headers
    add_header X-Frame-Options "SAMEORIGIN" always;
    add_header X-Content-Type-Options "nosniff" always;
    add_header X-XSS-Protection "1; mode=block" always;
    
    # Proxy to Next.js
    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_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
        proxy_set_header X-Forwarded-Proto $scheme;
        proxy_cache_bypass $http_upgrade;
    }
    
    # Static files
    location /_next/static {
        proxy_pass http://localhost:3000;
        add_header Cache-Control "public, max-age=31536000, immutable";
    }
}

# Enable site:
# sudo ln -s /etc/nginx/sites-available/my-app /etc/nginx/sites-enabled/
# sudo nginx -t
# sudo systemctl reload nginx

# ✅ HTTPS enabled
# ✅ Security headers
# ✅ Static file caching
# ✅ Reverse proxy configured

# Get SSL certificate
sudo certbot --nginx -d yourdomain.com -d www.yourdomain.com

# Follow prompts:
# - Enter email
# - Agree to terms
# - Choose to redirect HTTP to HTTPS

# Certbot will:
# ✅ Generate SSL certificate
# ✅ Configure Nginx automatically
# ✅ Setup auto-renewal

# Test auto-renewal
sudo certbot renew --dry-run

# ✅ Free SSL certificate
# ✅ Automatic renewal
# ✅ HTTPS enabled

# Update application
cd /var/www/my-app

# Pull latest code
git pull origin main

# Install dependencies (if changed)
npm install

# Build application
npm run build

# Restart PM2
pm2 restart next-app

# OR: Zero-downtime reload
pm2 reload next-app

# ✅ Application updated
# ✅ Zero or minimal downtime
# ✅ PM2 handles graceful restart

# Use static export when:
✅ No server-side rendering needed
✅ No API routes
✅ No ISR
✅ No middleware
✅ Purely static site (blog, docs, marketing)

# Benefits:
✅ Deploy to any static host (S3, Netlify, GitHub Pages)
✅ Extremely fast (pre-rendered HTML)
✅ Very cheap hosting
✅ No server required

# Limitations:
❌ No SSR
❌ No API routes
❌ No ISR
❌ No dynamic features
❌ Build time increases with pages

/** @type {import('next').NextConfig} */
const nextConfig = {
  output: 'export',
  
  // Optional: Trailing slash
  trailingSlash: true,
  
  // Optional: Image optimization disabled (or use external loader)
  images: {
    unoptimized: true,
  },
};

module.exports = nextConfig;

// ✅ Exports to 'out' directory
// ✅ Pure static HTML
// ✅ No server needed

# Build static export
npm run build

# Output in 'out' directory
ls out/
# index.html
# about.html
# _next/
# ...

# Deploy to any static host:

# AWS S3
aws s3 sync out/ s3://my-bucket --delete

# Netlify
netlify deploy --dir=out --prod

# GitHub Pages
# Push 'out' directory to gh-pages branch

# Surge
surge out/ my-site.surge.sh

# ✅ Static HTML files
# ✅ CDN-ready
# ✅ Fast and cheap