Skip to main content

Domain Setup

Swap yourname.vercel.app for a real domain.

When you're ready to go live on your own domain, the process is:

  1. Buy a domain (Namecheap, Cloudflare Registrar, etc.)
  2. Add it to Vercel
  3. Add a DNS record at your registrar
  4. Wait for SSL
  5. Update a few settings that reference the URL

1. Add the domain in Vercel

Project → Settings → Domains → Add.

Enter the root domain (mydirectory.com). Vercel will also offer to add www.mydirectory.com — usually a good idea.

Vercel Domains settings page

2. Add the DNS record

Vercel will show you which record to add. Typical cases:

Record typeHostValue
A@76.76.21.21 (Vercel's IP)
CNAMEwwwcname.vercel-dns.com

If you're using Cloudflare or Namecheap, open their DNS control panel and add the record exactly as Vercel shows.

DNS control panel with Vercel CNAME record

Cloudflare proxy

If you use Cloudflare, turn the proxy (orange cloud) OFF for the Vercel records — otherwise SSL handshake fails. Grey cloud = DNS only.

Propagation is usually 1–5 minutes. Vercel automatically provisions an SSL certificate once DNS resolves.

3. Update NEXT_PUBLIC_APP_URL

Vercel → Settings → Environment Variables → change NEXT_PUBLIC_APP_URL to https://mydirectory.com.

Redeploy so the new value takes effect. (Deployments tab → ... menu → Redeploy.)

4. Update Supabase redirect URLs

Supabase only allows OAuth sign-in to specific domains — add yours.

  1. Supabase → Authentication → URL Configuration
  2. Site URL: https://mydirectory.com
  3. Redirect URLs: add https://mydirectory.com/auth/callback

Without this, Google sign-in comes back to localhost:3000 and errors out.

5. Update the Stripe webhook

Stripe → Developers → Webhooks → edit the endpoint → change URL to https://mydirectory.com/api/webhooks/stripe → copy the new Signing secret → update STRIPE_WEBHOOK_SECRET in Vercel env vars → redeploy.

6. Update Resend "From" address

Once your custom domain is verified in Resend, emails can come from hello@mydirectory.com instead of onboarding@resend.dev. Set RESEND_PRODUCTION_FROM=hello@mydirectory.com in Vercel → redeploy.

7. (Optional) Redirect www to root (or vice versa)

Vercel lets you pick which is canonical. On the Domains page, look for the redirect toggle next to each domain.

Verifying everything

Once DNS settles:

  • https://mydirectory.com loads the homepage
  • Green padlock in the address bar (SSL is on)
  • Sign-in with Google completes and lands on /dashboard
  • A test Stripe payment sends a webhook and marks the order paid
  • A welcome email arrives from your domain (not resend.dev)

If any check fails, most often it's a missed env var — see Troubleshooting.