Deployment Process

Learn how to deploy Answer Overflow to production using Vercel and Convex

Answer Overflow uses Vercel for hosting the Next.js application and Convex for the backend/database.

Deployment Architecture

┌─────────────────────────────────────────────────┐
│                   Vercel                         │
│  ┌──────────────────────────────────────────┐  │
│  │     Next.js Application                   │  │
│  │  - Web UI (apps/main-site)                │  │
│  │  - API Routes                             │  │
│  │  - SSR & Static Generation                │  │
│  └──────────────────────────────────────────┘  │
└─────────────────────────────────────────────────┘
         │                                   │
         │ HTTPS                             │ WebSocket
         ▼                                   ▼
┌─────────────────────────────────────────────────┐
│                   Convex                         │
│  ┌──────────────────────────────────────────┐  │
│  │     Backend Functions                     │  │
│  │  - Queries, Mutations, Actions            │  │
│  │  - Database (packages/database)           │  │
│  │  - HTTP Endpoints                         │  │
│  └──────────────────────────────────────────┘  │
└─────────────────────────────────────────────────┘
         │
         │ Events
         ▼
┌─────────────────────────────────────────────────┐
│              Discord Bot (Separate)              │
│  - Runs on dedicated infrastructure              │
│  - Connects to Convex via client                 │
└─────────────────────────────────────────────────┘

Deploying to Convex

Convex hosts your database and backend functions.

Prerequisites

1. Install Convex CLI

   npm install -g convex
   
2. Login to Convex

   npx convex login
   
3. Create a project

   Go to convex.dev/dashboard and create a new project

Initial Setup

# Navigate to database package
cd packages/database

# Initialize Convex (if not already done)
npx convex dev

# This creates:
# - .env.local with CONVEX_DEPLOYMENT
# - convex/_generated/ with types

Deploying Updates

From packages/database/package.json:

# Deploy to production
bun run deploy

# This runs:
# bun run --env-file=../../.env.production convex deploy

The deployment process:

1. Validates schema and functions
2. Generates types in _generated/
3. Uploads functions to Convex
4. Runs migrations if defined
5. Activates new version

Environment Variables

Create .env.production in the repository root:

# Convex
CONVEX_DEPLOYMENT=prod:your-deployment-name

# Discord Bot
DISCORD_BOT_TOKEN=your_bot_token
DISCORD_CLIENT_ID=your_client_id
DISCORD_CLIENT_SECRET=your_client_secret

# Stripe
STRIPE_SECRET_KEY=sk_live_...
STRIPE_WEBHOOK_SECRET=whsec_...
STRIPE_USER_WEBHOOK_SECRET=whsec_...

# GitHub
GITHUB_CLIENT_ID=your_github_client_id
GITHUB_CLIENT_SECRET=your_github_client_secret

# Better Auth
BETTER_AUTH_SECRET=your_secret_key
BETTER_AUTH_URL=https://www.answeroverflow.com

# AWS S3 (for attachments)
AWS_ACCESS_KEY_ID=your_access_key
AWS_SECRET_ACCESS_KEY=your_secret_key
AWS_REGION=us-east-1
AWS_S3_BUCKET=your-bucket-name

Convex Dashboard

Monitor your deployment:

1. Go to convex.dev/dashboard
2. View Logs for function execution
3. Check Tables for data
4. Monitor Performance metrics
5. Review Errors and stack traces

Deploying to Vercel

Vercel hosts the Next.js application.

Prerequisites

1. Install Vercel CLI

   npm install -g vercel
   
2. Login to Vercel

   vercel login
   

Initial Setup

# Navigate to main site
cd apps/main-site

# Link to Vercel project
vercel link

# Follow prompts to create/link project

Configuration

From apps/main-site/vercel.json:

{
  "buildCommand": "./scripts/build.sh",
  "rewrites": [
    {
      "source": "/docs/:match*",
      "has": [
        {
          "type": "header",
          "key": "host",
          "value": "www.answeroverflow.com"
        }
      ],
      "destination": "https://answeroverflow.mintlify.dev/docs/:match*"
    }
  ]
}

Environment Variables in Vercel

Set these in Vercel Dashboard → Project → Settings → Environment Variables:

# Convex
NEXT_PUBLIC_CONVEX_URL=https://your-deployment.convex.cloud

# Better Auth
BETTER_AUTH_SECRET=your_secret_key
BETTER_AUTH_URL=https://www.answeroverflow.com

# Analytics
NEXT_PUBLIC_POSTHOG_KEY=phc_...
NEXT_PUBLIC_POSTHOG_HOST=https://us.i.posthog.com

# Optional: AI Gateway
NEXT_PUBLIC_AI_GATEWAY_URL=your_gateway_url

Deploying

# Preview deployment (branch)
vercel

# Production deployment
vercel --prod

Or use Git integration:

1. Push to GitHub
2. Vercel auto-deploys:
   • main branch → Production
   • Other branches → Preview

Build Configuration

Custom build script in apps/main-site/scripts/build.sh:

#!/bin/bash
set -e

# Install dependencies
echo "Installing dependencies..."
bun install

# Generate Convex types
echo "Generating Convex types..."
cd ../../packages/database
bun run codegen
cd ../../apps/main-site

# Build Next.js
echo "Building Next.js..."
bun run build

Discord Bot Deployment

The Discord bot runs separately from the web application.

Hosting Options

1. Dedicated Server (e.g., AWS EC2, DigitalOcean)
2. Container Platform (e.g., Railway, Fly.io)
3. Serverless (not recommended for bots with persistent connections)

Example: Railway Deployment

# Install Railway CLI
npm install -g @railway/cli

# Login
railway login

# Initialize project
cd apps/discord-bot
railway init

# Deploy
railway up

Bot Environment Variables

# Discord
DISCORD_BOT_TOKEN=your_bot_token
DISCORD_CLIENT_ID=your_client_id

# Convex
CONVEX_URL=https://your-deployment.convex.cloud
CONVEX_DEPLOY_KEY=your_deploy_key

# Sentry (optional)
SENTRY_DSN=your_sentry_dsn

Keeping Bot Running

Use a process manager:

# Using PM2
pm2 start bun --name "discord-bot" -- run start
pm2 save
pm2 startup

# View logs
pm2 logs discord-bot

# Restart
pm2 restart discord-bot

Continuous Deployment

GitHub Actions

Create .github/workflows/deploy.yml:

name: Deploy to Production

on:
  push:
    branches:
      - main

jobs:
  deploy-convex:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v3
      
      - name: Setup Bun
        uses: oven-sh/setup-bun@v1
      
      - name: Install dependencies
        run: bun install
      
      - name: Deploy Convex
        env:
          CONVEX_DEPLOY_KEY: ${{ secrets.CONVEX_DEPLOY_KEY }}
        run: |
          cd packages/database
          bun run deploy

  deploy-vercel:
    runs-on: ubuntu-latest
    needs: deploy-convex
    steps:
      - uses: actions/checkout@v3
      
      - name: Deploy to Vercel
        uses: amondnet/vercel-action@v25
        with:
          vercel-token: ${{ secrets.VERCEL_TOKEN }}
          vercel-org-id: ${{ secrets.VERCEL_ORG_ID }}
          vercel-project-id: ${{ secrets.VERCEL_PROJECT_ID }}
          vercel-args: '--prod'

Migrations

Convex supports database migrations.

Creating a Migration

// packages/database/convex/migrations/001_add_user_settings.ts
import { makeMigration } from "@convex-dev/migrations";
import { internalMutation } from "../client";

const migration = makeMigration(internalMutation, {
  migrationTable: "_migrations",
});

export default migration(async ({ db }) => {
  // Get all users without settings
  const users = await db.query("users").collect();

  for (const user of users) {
    if (!user.settings) {
      await db.patch(user._id, {
        settings: {
          notifications: true,
          theme: "system",
        },
      });
    }
  }
});

Running Migrations

Migrations run automatically on deployment, or manually:

cd packages/database
npx convex run migrations:run

Monitoring

Convex Logs

View function execution:

# Tail logs
npx convex logs --watch

# Filter by function
npx convex logs --function="messages:upsertMessage"

Vercel Analytics

1. Enable in Vercel Dashboard
2. View real-time metrics:
   • Page views
   • Web Vitals
   • Top pages

Sentry Error Tracking

// apps/main-site/src/app/error.tsx
import * as Sentry from "@sentry/nextjs";

export default function GlobalError({ error }: { error: Error }) {
  useEffect(() => {
    Sentry.captureException(error);
  }, [error]);

  return (
    <html>
      <body>
        <h1>Something went wrong</h1>
      </body>
    </html>
  );
}

Rollback

Convex

Rollback to previous deployment:

# View deployment history
npx convex deployments

# Rollback to specific deployment
npx convex deploy --rollback <deployment-id>

Vercel

1. Go to Vercel Dashboard → Deployments
2. Find previous working deployment
3. Click Promote to Production

Troubleshooting

Build failures on Vercel

Check build logs in Vercel Dashboard. Common issues:

• Missing environment variables
• TypeScript errors
• Convex types out of sync

# Regenerate Convex types locally
cd packages/database
bun run codegen

Convex deployment errors

# Validate schema locally
npx convex dev

# Check for syntax errors in functions

Discord bot not connecting

Verify:

• Bot token is correct
• Bot has required intents enabled
• CONVEX_URL points to production deployment

Next Steps

• Review Database patterns
• Check Testing strategies
• Explore Frontend Development