Deploy Next.js to Vercel — production checklist

Before you deploy

Make sure your app builds locally without errors: run npm run build. Fix any TypeScript errors or missing environment variables. Vercel runs the same build command — if it fails locally, it fails in production.

Step 1: Push to GitHub

Create a GitHub repository and push your code. Vercel connects directly to GitHub — every push to main triggers a new deployment automatically.

Step 2: Import in Vercel

Go to vercel.com/new. Click Import Git Repository and select your repo. Vercel detects Next.js automatically.

Step 3: Set environment variables

In Vercel > Settings > Environment Variables, add all keys from your .env.local. The critical ones for a SaaS:

• NEXT_PUBLIC_SUPABASE_URL and NEXT_PUBLIC_SUPABASE_ANON_KEY
• SUPABASE_SERVICE_ROLE_KEY
• STRIPE_SECRET_KEY and STRIPE_WEBHOOK_SECRET
• RESEND_API_KEY

Use production values here (live Stripe keys, not test keys). Never commit secrets to Git.

Step 4: Add your domain

In Vercel > Settings > Domains, add your domain (e.g. yourdomain.com). Vercel gives you DNS records — add them at your domain registrar. SSL is automatic. After DNS propagates (usually minutes), your app is live on your domain.

Post-deploy checklist

• Do a test purchase with Stripe (use a coupon for $0 or a low price)
• Check that webhooks fire and grant access
• Verify emails send (check Resend setup)
• Submit your sitemap to Google Search Console
• Test on mobile and different browsers