Admin Subdomain Setup Guide

Goal: Configure admin.crop-dev.app as custom domain for crop-front-admin

Current URL: crop-front-admin.vercel.app New URL: admin.crop-dev.app

Prerequisites

• Cloudflare account with crop-dev.app domain
• Vercel project: crop-front-admin
• Clerk account: sensible-jay-41.clerk.accounts.dev

Step 1: Cloudflare DNS (1 min)

1. Go to Cloudflare Dashboard → crop-dev.app → DNS → Records
2. Click "Add record"
3. Configure:
   • Type: CNAME
   • Name: admin
   • Target: cname.vercel-dns.com
   • Proxy status: ☁️ Proxied (orange cloud)
   • TTL: Auto
4. Save

Expected result:

CNAME  admin  cname.vercel-dns.com  Proxied

Step 2: Vercel Domain (2 min)

1. Go to Vercel Dashboard
2. Select project: crop-front-admin
3. Settings → Domains → Add Domain
4. Enter: admin.crop-dev.app
5. Add - Vercel will automatically verify DNS and provision SSL

Verification:

• Vercel will check CNAME record
• SSL certificate will be auto-provisioned (Let's Encrypt)
• Should show "Valid Configuration" within 1-2 minutes

Step 3: Clerk Domain (2 min)

1. Go to Clerk Dashboard
2. Select instance: sensible-jay-41 (Admin instance)
3. Configure → Domains
4. Add domain: admin.crop-dev.app
5. Save

Important:

• This is the admin Clerk instance (sensible-jay-41)
• NOT the frontend instance (mature-coral-22)
• No cross-domain auth needed - they are separate apps

Step 4: Vercel Environment Variables (2 min)

1. Go to Vercel Dashboard → crop-front-admin → Settings → Environment Variables
2. Add new variable:
   • Key: NEXT_PUBLIC_CLERK_DOMAIN
   • Value: admin.crop-dev.app
   • Environment: Production ✅ Preview ✅ Development ❌
3. Save

Note: Do NOT set this for Development (localhost)

Step 5: Redeploy (1 min)

1. Go to Vercel Dashboard → crop-front-admin → Deployments
2. Latest deployment → ⋯ → Redeploy

OR trigger new deployment:

cd /Users/vova/Code/CROP/crop-front-admin
git commit --allow-empty -m "chore: trigger redeploy for admin.crop-dev.app"
git push

Step 6: Verification (5 min)

DNS Check

dig +short admin.crop-dev.app
# Should return Cloudflare IPs: 104.x.x.x or 172.67.x.x

SSL Check

curl -I https://admin.crop-dev.app
# Should return HTTP/2 200
# server: Vercel

App Check

1. Open: https://admin.crop-dev.app
2. Expected: Dashboard loads
3. Click: "Sign In"
4. Expected: Clerk sign-in page
5. Sign in with your credentials
6. Expected: Redirected to /dashboard

Rollback Plan

If something goes wrong:

1. Remove Vercel domain:
   • Vercel → Settings → Domains → admin.crop-dev.app → Remove
2. Remove Cloudflare CNAME:
   • Cloudflare → DNS → admin → Delete
3. Remove Clerk domain:
   • Clerk → Domains → admin.crop-dev.app → Remove
4. Remove Vercel env var:
   • Vercel → Settings → Env Vars → NEXT_PUBLIC_CLERK_DOMAIN → Delete

Old URL crop-front-admin.vercel.app will continue to work.

Troubleshooting

DNS not resolving

# Check DNS propagation
dig admin.crop-dev.app @1.1.1.1
dig admin.crop-dev.app @8.8.8.8

Solution: Wait 5 minutes for DNS propagation

Vercel shows "Invalid Configuration"

Cause: CNAME not found or incorrect target Solution: Verify CNAME target is exactly cname.vercel-dns.com

Clerk auth fails

Cause: Domain not added to Clerk Solution: Add admin.crop-dev.app in Clerk Dashboard → Domains

SSL certificate error

Cause: Vercel still provisioning certificate Solution: Wait 2-3 minutes, Vercel auto-provisions Let's Encrypt cert

Local Environment Changes

File: /Users/vova/Code/CROP/crop-front-admin/.env.local

# Updated (commented out for local dev):
# Production domain: admin.crop-dev.app
# NEXT_PUBLIC_CLERK_DOMAIN=admin.crop-dev.app

Note: Leave commented for localhost development!

Summary

Total: ~13 minutes

Benefits

✅ Professional URL: admin.crop-dev.app vs crop-front-admin.vercel.app ✅ Brand Consistency: All under crop-dev.app domain ✅ Cloudflare Protection: WAF, DDoS, SSL ✅ Custom Domain Control: Not tied to Vercel branding ✅ Zero Cost: Free with existing Cloudflare + Vercel plans