Do protótipo ao deploy
Trechos do capítulo · alexandrecaramaschi.com/educacao/frontends-com-vibecoding

Leia o LEIA-ME.txt desta pasta antes de usar qualquer trecho.

### O que faz: pede a esteira completa de verificação e publicação, com bloqueio de entrada e rollback explicados
### Onde entra: conversa com o agente, num projeto Vite com React e TypeScript hospedado no GitHub
### Cuidado: a versão do runtime e as datas envelhecem; confira o calendário oficial de suporte antes de fixar qualquer versão no arquivo gerado

Gere o workflow de CI/CD do GitHub Actions para um frontend Vite + React 19 + TypeScript.
Requisitos do job de CI (roda em pull_request e push na main):
- checkout, setup-node com node-version: lts/* e cache de npm (não fixe Node 20: ele atingiu fim de vida em 30/04/2026, pelo calendário oficial de releases em https://github.com/nodejs/release, e CI em runtime sem suporte de segurança é passivo, não infraestrutura).
- npm ci (instalação reprodutível pelo lockfile).
- rode o script `verify` (tsc --noEmit && biome check && vitest run) e depois `npm run build`.
- Lighthouse CI com budget de LCP < 2,5s, falhando o job se estourar.
- use concurrency com cancel-in-progress para não pagar runs obsoletos.
Requisitos do job de deploy (só na main, só se a CI passou; use `needs`):
- deploy na Vercel lendo o token de ${{ secrets.VERCEL_TOKEN }}, nunca hardcoded.
- envie os source maps ao Sentry usando ${{ secrets.SENTRY_AUTH_TOKEN }} e NÃO publique os source maps no site.
Explique cada `env:` e me diga quais secrets devo cadastrar no GitHub e como faço rollback se o deploy quebrar.


### O que faz: a sequência local de uma funcionalidade, do ramo novo ao envio
### Onde entra: terminal, dentro do repositório do projeto
### Cuidado: o encadeamento com && faz o primeiro portão que falha impedir os seguintes

git checkout -b feat/nome-da-funcionalidade
npm run verify          # tipos + lint + testes, em menos de dez segundos
npm run build           # build local antes de qualquer envio
git add src/...         # só os arquivos intencionais
git commit -m "feat: descrição curta do que a tela faz"
git push origin feat/nome-da-funcionalidade


### O que faz: o mesmo portão rodando na integração contínua
### Onde entra: o arquivo de workflow do GitHub Actions, ou a configuração da Vercel
### Cuidado: use npm ci, e não npm install, para instalar as dependências travadas

npm ci                  # dependências limpas e determinísticas
npm run verify          # reprova a integração se algum portão falhar
npm run build           # gera o artefato
npx lhci autorun        # orçamento de LCP, CLS e acessibilidade; bloqueia se reprovar