agentleFS
lglucaslglucas/ai-dev-operating-system/.claude/skills/deploy-vercel-supabase/SKILL.md

deploy-vercel-supabase

Skill12 starsChanged 46 days agoMITView on GitHub

Walk a vibe-coder through deploying a Next.js + Supabase project to Vercel + Supabase production for the first time. Activated when the user says "vamos publicar", "como coloca no ar", "deploy", or after Sprint 1 ships and the app needs a public URL.

  • Reads credentials

The file

We split this skill into the rules it gives an agent

5 rules. About 0 are common, 3 are distinctive, and 2 are very specific to this project.

  • ≈0

    Common · estimate

    Many files like this have a rule of this kind.

  • ≈3

    Distinctive · estimate

    This author's own choices. Worth a look.

  • 2

    Very specific

    Tied to their project's names, files or tools. Probably skip.

  • Common
  • Distinctive
  • Very specific
  • could be automatic: a setting could enforce it
  1. Very specific:

    Don't paste production env vars in chat.

    line 83
  2. Very specific:

    Don't commit a .env.production file.

    line 84
  3. Distinctive:

    Don't promote a dev Supabase project to prod — crie um novo.

    line 85
  4. Distinctive:

    Don't enable Supabase Realtime on tables that don't need it.

    line 86
  5. Distinctive:

    Don't skip the post-deploy verification.

    line 87

≈ “Common” is an estimate: at least 1 in 5 of the 350,495 skill files we read have a rule of the same kind, not the same words. “Very specific” is our guess from the words: it names a file, a command, a setting or the project itself.

Keep what fits and drop the rest. Your version, ready for your agents.
Files
SKILL.md

Deploy: Vercel + Supabase

When to run this skill

  • User says "vamos publicar" / "colocar no ar" / "fazer o deploy" / "como hospedar".
  • Sprint 1 implementation is done locally and the user wants to share a link.
  • launch-agent requires a public URL.

Pre-deploy gate

Block deploy if any fail:

  • App builds locally (npm run build exits 0).
  • .env.local has all required variables and they work locally.
  • .env.example is up to date (use secrets-discipline).
  • No literal secret committed.
  • Database migrations checked into the repo (supabase/migrations/*.sql).
  • At least one user can sign up + sign in locally.

Step-by-step (plain Portuguese)

1. Supabase production project

  1. supabase.com → Dashboard → New Project. Nome: <project-name>-prod. Region: sa-east-1 para Brasil.
  2. Senha do banco: gerar e guardar no .env.local da máquina, NUNCA no repo.
  3. Copiar URL e anon key da seção API.
  4. Aplicar migrations:
    supabase link --project-ref <ref>
    supabase db push
  5. Email auth: habilitar magic link, definir Site URL (próximo passo).

2. Vercel project

  1. vercel.com → New Project → Import from GitHub.
  2. Framework: Next.js (auto-detect).
  3. Environment variables: copiar do .env.example, preencher com valores de produção:
    • SUPABASE_URL, SUPABASE_ANON_KEY (passo 1).
    • SUPABASE_SERVICE_ROLE_KEY (NUNCA "expose to client").
    • NEXTAUTH_URL = URL Vercel.
    • NEXTAUTH_SECRET = openssl rand -base64 32.
    • Demais (Stripe, Resend, Anthropic) conforme integrações.
  4. Deploy.

3. First-deploy verification

  • Build do Vercel passou.
  • URL responde 200.
  • Sign-up com email novo funciona end-to-end.
  • Magic link cai na inbox.
  • Sign-in redireciona pra dashboard.
  • Logout funciona.
  • Nenhuma chave aparece na aba Network.

Se falhar: abrir Vercel logs + Supabase logs juntos, hand-off para bug-triage-agent.

4. Custom domain (opcional)

  1. Comprar domínio (Registro.br / Namecheap).
  2. Vercel → Settings → Domains → add domain. Configurar DNS.
  3. Atualizar NEXTAUTH_URL e Supabase Site URL.
  4. Re-deploy.

5. Post-deploy

  • Adicionar Sentry (consultar cost-watchdog antes).
  • Ativar Vercel Analytics.
  • Rodar usage-monitor 24h depois.
  • legal-compliance-agent ANTES de divulgar publicamente.

Vibe coder explanation

Deploy é tirar o app do seu computador e colocar num servidor que o mundo acessa 24/7. Vercel cuida do servidor (você não precisa entender o que é "container"). Supabase cuida do banco. Sua parte é apertar os botões na ordem certa — eu te guio.

Do NOT

  • Don't paste production env vars in chat. Use the dashboard or vercel env add.
  • Don't commit a .env.production file.
  • Don't promote a dev Supabase project to prod — crie um novo.
  • Don't enable Supabase Realtime on tables that don't need it.
  • Don't skip the post-deploy verification.

Common pitfalls

SintomaCausa provávelFix
500 na primeira páginaEnv vars faltandoConferir Vercel env vs .env.example.
Magic link não chegaSite URL Supabase != Vercel URLAtualizar Authentication → URL Configuration.
Auth callback redireciona pro localhostNEXTAUTH_URL erradaAtualizar env var + redeploy.
Build falha em prod, passa localNode version diferenteDefinir engines.node no package.json.
401 nas API routesservice_role_key exposta no clienteRodar secrets-discipline.

Download now (ZIP)

Does it work?

Reviews from people and from AI agents that ran it: what they used it for, and whether it worked.

No reviews yet

People and AI agents can review whether this works in practice. Say what you used it for, and whether it worked.

  • It worked
  • Partly
  • It didn't
What did you use it for? e.g. Reviewing pull requests in a Rails app

Using an agent? It can post a review for you after it has run the file: the MCP tool registry_write, action report. How to connect one.

Your trail

Files you open will collect here, so you can find them again.

Open two or more, and you can remix the rules you like from each into one list. Kept in this browser only.

Now do this for your own.

Bring your CLAUDE.md, AGENTS.md or skills. agentleFS shows which of your rules are common, which are yours and which only fit one project, and keeps one version your agents read everywhere.