Shipping an AI-built app to your own domain: the DNS-to-HTTPS path (and the cost trap nobody warns you about)

The two DNS records you actually need

Every custom-domain setup comes down to two questions: what happens when someone types yourdomain.com, and what happens when they type www.yourdomain.com.

• The apex (root) domain - yourdomain.com with nothing in front. DNS rules say the apex normally needs an A record (pointing at an IP), which is fragile because IPs change. Better hosts support ALIAS / ANAME or CNAME flattening, which let the apex behave like a CNAME. On Cloudflare, flattening is automatic.
• The www subdomain - easy: a CNAME pointing at your host's target (e.g. cname.vercel-dns.com, your-site.netlify.app, or your-project.pages.dev).

Then pick one as canonical and redirect the other. "www to apex" or "apex to www" - either is fine, but pick one or you'll split your SEO and confuse analytics.

The most common mistake: adding only the www record, then wondering why yourdomain.com shows a blank page. You need both, plus a redirect.

HTTPS - why the padlock doesn't show up

All three major hosts issue free certificates (via Let's Encrypt) and auto-renew them. You don't buy an SSL cert in 2026. But provisioning silently fails in two situations, and the error messages are useless:

• DNS hasn't propagated yet. The cert can't be issued until the host can verify the domain points at them - a minute to a few hours. If HTTPS "isn't working," wait, then re-check. Don't start changing things.
• You put Cloudflare's proxy in front of another host. If your domain is on Cloudflare (orange cloud = proxied) and you deploy to Vercel or Netlify, you can get SSL handshake errors or infinite redirect loops - two systems both trying to terminate TLS. Fix: set that DNS record to DNS-only (grey cloud), or set Cloudflare's SSL mode to Full (strict). Never leave it on "Flexible" - that's the redirect loop.

Deploying to Cloudflare Pages while your domain is already on Cloudflare? None of this applies - it wires itself up.

The cost trap nobody mentions

"Free hosting" is real, but the free tiers are shaped very differently, and the thing that bites you is almost never storage - it's bandwidth and build minutes, plus one licensing clause.

Rough shape of the three most common choices (always re-check current limits - these change):

Two things to internalize:

• Vercel's Hobby plan is for non-commercial projects. The moment your app is a business, their terms want you on Pro ($20/mo). It's not a bandwidth wall you hit by accident - it's a licensing line you cross the day you charge money.
• Netlify meters bandwidth + build minutes. A page that goes mildly viral, or a repo that rebuilds on every commit, can blow past the free tier fast, and overage pricing is steep.

For a hobby or static/marketing site, Cloudflare Pages is the boring, honest default - genuinely generous free tier, no commercial-use asterisk. For an app with server-side logic you're iterating on, Vercel and Netlify are excellent - just budget for the paid tier from day one instead of being surprised.

The clean path, end to end

• Put your DNS on the same provider you host with where possible (fewer moving parts, fewer TLS conflicts).
• Add the apex record (A / ALIAS / flattened CNAME) and the www CNAME.
• Pick a canonical host (apex or www) and redirect the other.
• Wait for DNS to propagate before touching SSL. Let the cert auto-issue.
• Proxying through Cloudflare in front of another host? Set SSL to Full (strict) - not Flexible.
• Test http:// and https://, apex and www, in an incognito window.

That's the whole thing. The AI writes the app; this is the ten steps between "it works on my screen" and "it works on my domain."

I keep field notes like this - real builds with AI tools, timed, with the raw numbers - over at Build Lab. The full walkthrough, with screenshots of each DNS panel, is here.