Deployment | Quotes

What you'll learn

Understand the deployment pipeline from local dev to production

Configure Vercel for zero-config frontend and serverless deployments

Manage environment variables across development and production

Set up a custom domain with automatic SSL certificates

Implement preview deployments for feature branch testing

Monitor production with analytics, logging, and error reporting

Ship your application to production.

Platform Options

Platform	Best For
Vercel	Next.js (native)
Netlify	Static sites, SPAs
Railway	Full-stack apps
Fly.io	Containerized apps
AWS	Enterprise

Next.js Build

# Build for production
pnpm build

# Start production server
pnpm start

# Output: .next/ folder with:
# - Static HTML pages
# - Server-side rendered pages
# - API routes

Environment Variables

# .env.local (local development, git-ignored)
DATABASE_URL="postgresql://..."
NEXT_PUBLIC_API_URL="http://localhost:3001"

# .env.production (production values)
DATABASE_URL="postgresql://prod..."
NEXT_PUBLIC_API_URL="https://api.example.com"

CI/CD

# .github/workflows/deploy.yml
name: Deploy
on:
  push:
    branches: [main]

jobs:
  deploy:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: pnpm/action-setup@v4
      - run: pnpm install
      - run: pnpm build
      - run: pnpm deploy # platform-specific

Next Steps

Key Takeaways

Vercel auto-detects Next.js and provides zero-config deployment with preview URLs on every push

Environment variables must be configured separately for each environment (development, preview, production)

Custom domains with automatic SSL certificates eliminate manual DNS+HTTPS setup

Preview deployments give every branch a unique URL, enabling pre-merge QA testing

Production monitoring requires error tracking, performance analytics, and structured logging

Platform

Best For

Vercel

Next.js (native)

Netlify

Static sites, SPAs

Railway

Full-stack apps

Fly.io

Containerized apps

AWS

Enterprise

# .env.local (local development, git-ignored) DATABASE_URL="postgresql://..." NEXT_PUBLIC_API_URL="http://localhost:3001" # .env.production (production values) DATABASE_URL="postgresql://prod..." NEXT_PUBLIC_API_URL="https://api.example.com"

# .github/workflows/deploy.yml name: Deploy on: push: branches: [main] jobs: deploy: runs-on: ubuntu-latest steps: - uses: actions/checkout@v4 - uses: pnpm/action-setup@v4 - run: pnpm install - run: pnpm build - run: pnpm deploy # platform-specific