Deployment

NextShip is optimized for deployment on Vercel, but works with any Node.js hosting.

Vercel Deployment

1. Connect Repository

1. Go to vercel.com
2. Click "Add New Project"
3. Import your GitHub repository
4. Select the Next.js framework preset

2. Configure Environment Variables

Add all required environment variables in Vercel project settings:

# Required
NEXT_PUBLIC_APP_URL=https://yourdomain.com
DATABASE_URL=postgresql://...
BETTER_AUTH_SECRET=your-secret
 
# Stripe
STRIPE_SECRET_KEY=sk_live_xxx
STRIPE_WEBHOOK_SECRET=whsec_xxx
NEXT_PUBLIC_STRIPE_PUBLISHABLE_KEY=pk_live_xxx
 
# Resend
RESEND_API_KEY=re_xxx
 
# OAuth (if using)
GOOGLE_CLIENT_ID=xxx
GOOGLE_CLIENT_SECRET=xxx
GITHUB_CLIENT_ID=xxx
GITHUB_CLIENT_SECRET=xxx

3. Deploy

Click "Deploy" and Vercel will:

• Install dependencies
• Build the project
• Deploy to production

4. Configure Domain

1. Go to project settings → Domains
2. Add your custom domain
3. Update DNS records as instructed

Stripe Webhook Setup

For production, configure Stripe webhooks:

1. Go to Stripe Dashboard → Developers → Webhooks
2. Add endpoint: https://yourdomain.com/api/stripe/webhook
3. Select events:
   • checkout.session.completed
   • customer.subscription.updated
   • customer.subscription.deleted
   • invoice.payment_failed
4. Copy the signing secret to STRIPE_WEBHOOK_SECRET

Database Setup

Neon (Recommended)

1. Create account at neon.tech
2. Create a new project
3. Copy the connection string to DATABASE_URL
4. Run migrations: pnpm db:push

Other PostgreSQL Providers

• Supabase
• Railway
• PlanetScale (MySQL mode)
• AWS RDS

Deployment Checklist

Before going live:

• All environment variables configured
• Database migrated
• Stripe webhook endpoint configured
• Email domain verified in Resend
• OAuth apps configured for production URLs
• Error monitoring set up (Sentry)
• Analytics configured (PostHog)
• Custom domain configured
• SSL certificate active

Performance Optimization

Edge Functions

Next.js automatically uses edge functions for:

• Middleware
• API routes (when configured)

Image Optimization

Configure allowed domains in next.config.ts:

images: {
  remotePatterns: [
    { hostname: "yourdomain.com" },
    { hostname: "avatars.githubusercontent.com" },
  ],
}

Caching

• Static pages are cached at the edge
• API responses can be cached with Cache-Control headers
• Use Upstash Redis for application-level caching

Monitoring

Sentry (Error Tracking)

// sentry.client.config.ts
Sentry.init({
  dsn: process.env.NEXT_PUBLIC_SENTRY_DSN,
  tracesSampleRate: 1.0,
});

PostHog (Analytics)

// providers.tsx
<PostHogProvider apiKey={process.env.NEXT_PUBLIC_POSTHOG_KEY}>
  {children}
</PostHogProvider>

Cost Estimation