How to Actually Deploy Your Vibe-Coded App.

"Deploying" sounds like one action. It's actually six, stacked. AI tools blur this because they conflate "host" with "deploy" with "ship", but the steps are independent and you can fail any of them in isolation.

1. Build — produce a deterministic artifact (a folder, a container, a bundle).
2. Host — find a machine, a serverless runtime, or a CDN edge to serve it.
3. Configure — load secrets, region, scale, env-specific behavior.
4. Route — point a domain at the host with HTTPS.
5. Observe — know within minutes when something is broken.
6. Revert — get back to the last good version on demand.

Modern hosts collapse steps 1–4 into one git push. Steps 5 and 6 are still on you. Those are the steps people skip and then regret at 11pm on a Saturday.

Most vibe-coded apps land in one of four shapes: static SPA, full-stack framework (Next/Nuxt/SvelteKit), edge functions, or "I need a real server." The host matrix below is what's actually true in May 2026 — not what was true when the framework's docs were written.

Opinionated default: If your AI agent built a Next.js or Vite app and you don't know what to pick, Cloudflare Pages for static-heavy and Vercel for anything with server components. You can move later — both export standard Node output.

The number one way vibe-coded apps blow up isn't downtime — it's a committed API key. An AI agent helpfully inlines OPENAI_API_KEY="sk-..." in a config file, you don't notice, the repo is public, a scanner finds it in 90 seconds, your card gets charged $4,000 by a botnet.

Three layers, all of them cheap, none of them optional:

# Layer 1 — never even tempt git
.env
.env.*
!.env.example
.dev.vars
*.pem
*.key
*-key.json
secrets/
.wrangler/

# Layer 2 — refuse to commit if a key shows up
brew install gitleaks
echo '#!/bin/sh
gitleaks protect --staged --redact --no-banner || exit 1' > .git/hooks/pre-commit
chmod +x .git/hooks/pre-commit

Layer 3 happens on the repo host. Enable secret scanning in GitHub settings → Code security → Secret protection. It runs even on private repos. If a key does leak, GitHub notifies the issuing provider (OpenAI, Anthropic, Stripe, AWS) within minutes and they auto-revoke. This has saved more vibe coders than they will ever know.

For the env vars themselves, all five hosts in the matrix above support a UI panel or CLI for setting them. The only rule: nothing sensitive in NEXT_PUBLIC_, VITE_, or any other prefix that gets inlined into the client bundle.

Every modern host gives you a free *.vercel.app / *.netlify.app / *.pages.dev URL by default. Custom domains take three steps:

1. Buy a domain (Porkbun, Namecheap, or Cloudflare Registrar at-cost).
2. Add the host's required DNS records — typically a CNAME for www and either an A record or ALIAS for the apex. The host shows you the exact values.
3. Wait. Propagation is usually under 10 minutes; cap your refresh impulse.

HTTPS is automatic on every host listed above via Let's Encrypt. You do not need to buy a certificate. If anyone tries to sell you one, walk away.

One toggle worth flipping after the cert lands: enforce HTTPS redirects so http://yourapp.com 301s to https://yourapp.com. Vercel and Netlify do this by default; Cloudflare needs an "Always Use HTTPS" page rule.

You don't need a dashboard. You need to know within five minutes that something broke. Two pieces:

1. Exception tracking. AppSignal, Sentry, or Honeybadger. Pick one, install in five minutes, walk away. The first time a user hits a 500 and you fix it before they email you, the value pays for the next decade of subscriptions.

2. Uptime check. UptimeRobot (free, 5-min interval) or Better Stack (free, 3-min). Point it at your home page, get a text when it's down. That's it.

Skip — for now — the rest: distributed tracing, RUM, custom metrics, log aggregation. Those are real tools for real teams. You are one person with an AI agent and a hobby. Two signals is the right size.

npm install @appsignal/nextjs
# or: @appsignal/nodejs, @appsignal/javascript

# add to instrumentation.ts
import { Appsignal } from "@appsignal/nodejs";
new Appsignal({
  active: true,
  name: "my-app",
  pushApiKey: process.env.APPSIGNAL_PUSH_API_KEY,
});

On every host worth using, rollback is one CLI command or one dashboard click. The discipline is doing it once on purpose, while nothing is on fire, so you remember the shape of it when something is on fire.

# Vercel
vercel rollback                        # latest previous deploy
vercel rollback <deployment-url>     # specific one

# Netlify
netlify rollback                      # UI also has "Publish deploy" on any past build

# Cloudflare Pages
# Dashboard → Pages project → Deployments → ⋯ → "Rollback to this deployment"

# Fly.io
fly releases                          # find the release id
fly deploy --image-label v123          # re-deploy that one

Do this now, on your existing deploy: roll back to the previous release, sit with it for 30 seconds, roll forward again. Cost: 60 seconds. Value: you'll do it confidently at 3am when production is on fire.

Twelve things you should be able to answer yes to before a vibe-coded app meets the open internet. Tap each one as you confirm it. Your score is saved in this browser, so you can come back tomorrow.

0–6: don't ship yet. 7–9: ok to ship to friends. 10–11: ok to put in your portfolio. 12: ok to start charging money for.