🌐 Domain Management

Point a custom domain to your Web3 app and manage DNS and SSL so users get a professional, secure URL.

Whether your app is on Vercel , Netlify , Cloudflare Pages , or another host, the same concepts apply: DNS records and HTTPS.

🎯 Why Custom Domains Matter

• Trust — app.yourproject.io looks more professional than random-name-123.vercel.app
• Branding — Same name across marketing, docs, and app
• Stability — Change hosting without changing the URL users know
• SEO and links — One canonical URL to share and index

📚 Core Concepts

🛠️ Where to Buy and Manage Domains

• Cloudflare Registrar — At-cost pricing, DNS and proxy in one place
• Namecheap — Popular, good support
• Google Domains (now Squarespace) — Simple UI
• Porkbun — Low prices, straightforward DNS
• Vercel Domains — Buy and attach in one flow if you deploy on Vercel

You can buy the domain at one place and manage DNS at another (e.g. buy at Namecheap, use Cloudflare DNS  for free).

📋 Adding a Custom Domain (High Level)

1. Buy the domain (or use one you already own).
2. Add the domain in your host (Vercel, Netlify, etc.); they’ll show required DNS records.
3. Create DNS records at your registrar or DNS provider (see below).
4. Wait for propagation (minutes to 48 hours; often under 15 minutes).
5. Enable HTTPS — Most hosts do this automatically once DNS is correct.

🔧 DNS Records: What to Add

Hosts tell you exactly which records to create. Typical patterns:

Vercel

• Add a domain  in Project → Settings → Domains.
• For root yourproject.io they often ask for:
  • A 76.76.21.21 (or the IP they show)
• For www or app they usually ask for:
  • CNAME www (or app) → cname.vercel-dns.com

Example (conceptual; use the values Vercel shows):

# At your DNS provider (e.g. Cloudflare, Namecheap)

Type   Name   Value                    TTL
----   ----   -----                    ---
A      @      76.76.21.21              3600
CNAME  www    cname.vercel-dns.com      3600

Netlify

• Add custom domain  in Domain settings.
• Netlify gives you a target like your-site.netlify.app. Typical:
  • CNAME www → your-site.netlify.app
  • For apex they may use ANAME/ALIAS or A to their load balancer; follow their UI.

Cloudflare Pages

• Custom domains  — If the domain is on Cloudflare, add it in the Pages project; CNAME or A/AAAA as shown.

Generic (any host)

If your host gives you an IP:

Type   Name   Value           TTL
----   ----   -----           ---
A      @      203.0.113.10    3600
A      www    203.0.113.10    3600

If they give you a hostname:

Type   Name   Value
----   ----   -----
CNAME  www    your-app.fly.dev

🔒 SSL/HTTPS

• Vercel / Netlify / Cloudflare Pages — Provision certificates automatically once DNS points to them.
• Custom server — Use Let’s Encrypt  with Certbot  or your host’s tooling.
• Cloudflare — Can proxy traffic and terminate SSL; enable “Full (strict)” if you use their SSL.

No code change is required for basic HTTPS; it’s configured at the host/DNS level.

📝 Example: Cloudflare DNS (Web UI)

1. Log in at dash.cloudflare.com .
2. Select the zone (your domain).
3. Go to DNS → Records.
4. Add record:
   • Type: CNAME
   • Name: app (for app.yourproject.io)
   • Target: cname.vercel-dns.com (or the value from your host)
   • Proxy status: Proxied (orange cloud) or DNS only (grey), as you prefer.
5. Save. Propagation is usually quick.

🖥️ Example: CLI (Cloudflare)

If you use Cloudflare API  or Wrangler , you can add records via CLI:

# Create CNAME for app.yourproject.io → Vercel
# (Replace ZONE_ID and values with yours)
curl -X POST "https://api.cloudflare.com/client/v4/zones/ZONE_ID/dns_records" \
  -H "Authorization: Bearer YOUR_API_TOKEN" \
  -H "Content-Type: application/json" \
  --data '{
    "type": "CNAME",
    "name": "app",
    "content": "cname.vercel-dns.com",
    "ttl": 3600,
    "proxied": false
  }'

✅ Checklist

• Domain bought and DNS accessible (registrar or Cloudflare)
• Domain added in hosting dashboard (Vercel/Netlify/Pages)
• A and/or CNAME records created as instructed
• Propagation waited (check with whatsmydns.net )
• HTTPS working (host usually does this automatically)
• Optional: Environment variables for app URL if needed

🔗 Further Reading

• Vercel: Custom Domains 
• Netlify: Custom domains & HTTPS 
• Cloudflare DNS 
• Let’s Encrypt 
• What’s My DNS  — Check DNS propagation