Índice
- 1. Por que "agente de IA + deploy na Vercel" é o padrão de 2026
- 2. As três abordagens em 5 minutos
- 3. Abordagem 1: Mínima (deploy automático com git push)
- 4. Abordagem 2: MCP-Direct (Cursor + Vercel Agent Skills)
- 5. Abordagem 3: GitHub Actions (PR-driven completo)
- 6. Estratégia de preview — branch, URL, A/B
- 7. Quatro armadilhas — vazamento de env, custos, conflitos, rollback
- Resumo
- FAQ
"O Claude Code editou o arquivo, agora muda para o terminal, git push, muda para o navegador, abre o painel da Vercel..." Era assim até 2025. Desde maio de 2026, a Vercel publica oficialmente seus Agent Skills (via MCP) e um plugin para Claude Code, e o Cursor se conecta com um único arquivo .cursor/mcp.json. "Editar código, build, deploy, conferir a URL de preview, atualizar variáveis de ambiente, fazer rollback" tudo acontece dentro do agente de IA. O imposto de "mudar para o navegador" sumiu.
De saída: a realidade de 2026 é combinar as três abordagens. (1) Mínima (git push, deploy automático em 60-90 segundos) basta para quem trabalha sozinho. (2) MCP-Direct (Vercel Agent Skills) permite que Cursor ou Claude Code chamem vercel deploy diretamente, ideal para quem alterna entre ambientes todos os dias. (3) GitHub Actions + Claude Code Action dá aos times o fluxo "comente @claude no PR e a IA conserta + redepliga o preview", perfeito para culturas com muita revisão. Não existe um "melhor" absoluto: existe um "melhor para o seu fluxo de trabalho".
Minha opinião pessoal de saída: solo com 1-3 projetos, (1); trabalho diário multi-ambiente, (2); time orientado a revisão, (3). As maiores minas: vazamento de variáveis de ambiente e "a IA faz deploy sozinha e os custos explodem". Defenda-se com spending limit + previews restritos + Cloudflare como proxy na frente: esse é o conjunto padrão de proteções de 2026. Leia em conjunto com A IA recomenda Vercel, Cursor explicado e A IA dá conta da infraestrutura? para o contexto completo. Este artigo percorre as três implementações, a estratégia de preview e as quatro armadilhas, tudo com código que funciona, baseado em dados de maio de 2026.
Três fluxos: solo, intermediário, time
— "Mudar para o navegador" era o imposto de 2025. Acabou.
Maio 2026: Vercel Agent Skills (MCP) + Claude Code GitHub Actions v1.0. "De código a deploy" é totalmente conduzido pelo agente.
O tempo humano se reduz a aprovar e monitorar.
1. Por que "agente de IA + deploy na Vercel" é o padrão de 2026
Até 2025, "fazer a IA escrever código" e "fazer deploy" eram dois mundos separados. Edita no Cursor ou Claude Code, muda para o terminal, git add . && git commit -m "fix" && git push, muda para o navegador, vê o painel da Vercel, copia a URL de preview e cola no Slack. Essa troca de contexto acontecia dezenas de vezes por dia e ia envenenando aos poucos a experiência de quem programa.
Duas coisas grandes mudaram em 2026. (1) A Vercel lançou Agent Skills (Model Context Protocol = MCP), o mecanismo que permite que agentes de IA chamem APIs da Vercel "como ferramentas, diretamente". (2) A Anthropic lançou Claude Code GitHub Actions v1.0: você escreve @claude fix this bug num comentário de PR e a IA executa a correção, o deploy de preview e a resposta ao comentário automaticamente. O fato de a própria Vercel ter lançado vercel/vercel-deploy-claude-code-plugin segue na mesma direção.
O fluxo padrão de maio de 2026 já é: "No Cursor, diga 'adicione esta funcionalidade, depligue e me dê a URL de preview', e 30 segundos depois a URL aparece no chat". Como vimos em O que é MCP e Claude Agent SDK, MCP virou "o USB-C que conecta agentes de IA aos seus sistemas de negócio", e essa integração com a Vercel é o exemplo funcionando mais óbvio.
2. As três abordagens em 5 minutos
Compare as três por "peso do setup x profundidade da automação".
| Abordagem | Setup | Automação | Tamanho ideal | Como se usa |
|---|---|---|---|---|
| 1. git push | 5 min (um link no GitHub) | ★★☆☆☆ | Solo / 2-3 pessoas | IA edita, você faz git push |
| 2. MCP-Direct | 10 min (mcp.json + token) | ★★★★☆ | Solo / intermediário / 5 | IA chama vercel deploy direto |
| 3. Actions | 30 min (workflow + secrets) | ★★★★★ | Times de 3+ | Comentário @claude no PR, tudo automático |
Guia rápido para escolher: "Você abre o painel da Vercel mais de 10 vezes por mês?" A (2) compensa o setup. "Revisão de PR é diária?" A (3) alivia muito. "Escala de blog pessoal?" A (1) basta: super-engenheirar vai custar mais em manutenção do que economiza.
3. Abordagem 1: Mínima (deploy automático com git push)
A base mais usada. Conecta Vercel e GitHub uma vez só e cada git push dispara um deploy que está no ar em 60-90 segundos. A IA só "escreve código, escreve a mensagem de commit e roda git push".
# One-time setup
1. Vercel dashboard -> Add New Project
2. Pick the GitHub repo -> Import
3. Framework Preset: Next.js (auto-detected)
4. Environment Variables: add as needed
5. Deploy -> done
# Daily flow (inside Cursor/Claude Code)
> Make this button red. When done, git push to deploy.
# What the AI runs
git add app/components/Button.tsx
git commit -m "feat: change primary button to red"
git push origin main
# Vercel auto-deploys -> live in 90 seconds
O valor real dessa configuração: "cada branch ganha uma URL de preview gerada automaticamente". Empurra feature/red-button e a Vercel sobe https://your-app-git-feature-red-button-yourname.vercel.app sozinha. Diga à IA "crie a branch feature/redesign, atualize o design e cole a URL de preview no Slack" e o ciclo todo acontece sem você tocar em nada.
Atenção: o plano Hobby proíbe uso comercial. Reveja as armadilhas de preço em A IA recomenda Vercel §5. Se a IA começar a gerar previews em massa, os build minutes queimam rapidíssimo.
4. Abordagem 2: MCP-Direct (Cursor + Vercel Agent Skills)
A abordagem destaque de 2026. Os Agent Skills (servidor MCP) oficiais da Vercel se conectam diretamente ao Cursor ou ao Claude Code e deixam o agente de IA chamar as APIs da Vercel diretamente. O passo de "mudar para o navegador" desaparece por completo.
# Setup (10 min)
1. Get a Vercel token: vercel.com/account/tokens
2. In Cursor, create .cursor/mcp.json:
{
"mcpServers": {
"vercel": {
"url": "https://mcp.vercel.com/<team-slug>",
"headers": {
"Authorization": "Bearer <VERCEL_TOKEN>"
}
}
}
}
3. Restart Cursor -> confirm MCP server connection
É só isso para usar estes slash commands dentro do Cursor:
# Practical slash commands
/deploy # preview-deploy the current branch
/deploy --prod # production deploy
/status # latest deployment status
/logs # fetch build logs
/env list # list environment variables
/env add KEY VALUE # add env var (preview/production scoped)
/rollback # roll back to the previous deployment
O grande ganho real: "tudo acontece dentro da conversa". Diga "adicione esta API, depligue para preview e, se der erro, leia os logs e conserte" e a IA executa editar código, /deploy, /logs, identificar o erro, corrigir, /deploy de novo, autonomamente. No quadro do semáforo de A IA dá conta da infraestrutura?, isso é zona "amarela": o humano foca em "aprovação final e monitoramento de custos".
Quem usa Claude Code tem o vercel-deploy-claude-code-plugin oficial da Vercel. Instale para ter as mesmas capacidades.
5. Abordagem 3: GitHub Actions (PR-driven completo)
A abordagem topo para times. Com Claude Code GitHub Actions v1.0 basta mencionar @claude em um comentário de PR e a IA executa edição de código + testes + deploy de preview + resposta no PR automaticamente.
# Setup (30 min)
1. In Claude Code, run /install-github-app
2. Install on the repo -> secrets auto-configured
3. .github/workflows/claude.yml is auto-generated
name: Claude Code
on:
issue_comment: { types: [created] }
pull_request_review_comment: { types: [created] }
jobs:
claude:
if: contains(github.event.comment.body, '@claude')
runs-on: ubuntu-latest
steps:
- uses: anthropics/claude-code-action@v1
with:
anthropic_api_key: ${{ secrets.ANTHROPIC_API_KEY }}
# 4. Add preview deploy via .github/workflows/vercel.yml
name: Vercel Preview
on: pull_request
jobs:
deploy:
runs-on: ubuntu-latest
steps:
- uses: actions/checkout@v4
- run: npm i -g vercel
- run: vercel pull --yes --environment=preview --token=${{ secrets.VERCEL_TOKEN }}
- run: vercel build --token=${{ secrets.VERCEL_TOKEN }}
- run: vercel deploy --prebuilt --token=${{ secrets.VERCEL_TOKEN }}
Isso reescreve a operação. Exemplo de fluxo de PR:
# Developer opens a PR -> preview auto-deploys
[Bot] Vercel Preview: https://your-app-pr-42.vercel.app
# Reviewer adds a PR comment
@claude also change the hover state on this button
# 5 minutes later Claude commits the fix
[Bot Claude] commit pushed: 'feat: add hover state to button'
[Bot] Vercel Preview updated: https://your-app-pr-42.vercel.app
# Reviewer checks -> approve -> merge -> production auto-deploy
O verdadeiro poder: o cenário em que "humanos não tocam no código até o PR estar pronto" vira realidade. Como discutimos em veteranos vs juniores e a IA vai eliminar o trabalho de escritório?, "a IA absorve o trabalho júnior" tem aqui sua implementação mais concreta. O time se concentra em revisão, a IA implementa: essa é a nova divisão do trabalho.
6. Estratégia de preview — branch, URL, A/B
Nas três abordagens, "usar os ambientes de preview com estratégia" é a alavanca. A Vercel emite automaticamente uma URL única para cada branch que não seja produção, então "experimente a mesma mudança de três jeitos e compare" é praticamente de graça.
Três formas de aproveitar os ambientes de preview
develop como ambiente de staging permanente. Variáveis de ambiente com escopo de preview garantem que o BD de produção fica seguro; valide o comportamento sem risco.
As variáveis de ambiente ficam totalmente isoladas entre development / preview / production: segredos de staging não vazam para produção.
Controle de custos: desative o deploy automático e nem uma IA descontrolada consegue estourar os build minutes.
7. Quatro armadilhas — vazamento de env, custos, conflitos, rollback
Se você entrega o deploy automático a um agente de IA, vai cair em quatro armadilhas, garantido. Monte as defesas desde o começo e evita 80% dos incidentes.
Quatro armadilhas da operação com agentes de IA
Solução:
.env* no .gitignore, GitHub Push Protection / Secret Scanner ativados, instrua a IA para nunca usar git add ..Solução: Spending Limit da Vercel, desabilite o deploy automático de preview, instrua a IA para "agrupar e empurrar no fim".
Solução: regra 1 PR = 1 issue = 1 agente de IA, convenção de nomes de branch, CODEOWNERS para limitar a auto-aprovação.
Solução: Vercel Instant Rollback, monitor de erros tipo Sentry, gate obrigatório de aprovação humana para produção.
Conjunto padrão de defesas: Spending Limit + Cloudflare como proxy na frente + monitoramento com Sentry.
Isso garante que "mesmo que a IA descarrile, o estrago não é fatal".
Aviso adicional: "automatizar 100% o deploy de produção com IA" não é recomendado. Mesmo com as abordagens (2) e (3), exija aprovação humana para os deploys de produção: essa é a realidade de maio de 2026. Como vimos em cuidados com o que você passa para a IA, a IA pode quebrar produção por erros completamente inocentes. Automatize até preview ou staging e bloqueie produção com aprovação em duas etapas.
Resumo
"Fazer deploy do Claude Code ou Cursor para a Vercel": em maio de 2026, a era de "mudar para o navegador" acabou. Vercel Agent Skills (MCP) e Claude Code GitHub Actions v1.0 colapsam "código, build, deploy, URL de preview, gestão de env, rollback" em um único fluxo dentro do agente.
Escolha pelo seu fluxo de trabalho: (1) desenvolvimento solo, git push (5 min de setup, 60-90 s de deploy), (2) desenvolvedor intermediário que abre o painel da Vercel mais de 10 vezes por mês, MCP-Direct (Cursor + .cursor/mcp.json), (3) time orientado a revisão, GitHub Actions (@claude, auto-fix + preview deploy). Use os previews para comparação A/B, staging permanente e revisão com cliente. Defenda-se das quatro armadilhas (vazamento de env, explosão de custos, conflitos de PR, rollback esquecido) com Spending Limit + Cloudflare como proxy + Sentry + aprovação humana em produção.
Relacionados: A IA recomenda Vercel, Vercel AI SDK, v0 vs Bolt vs Lovable, Cursor explicado, A IA dá conta da infraestrutura?
FAQ
P. Isso funciona também no Cloudflare Pages ou no Netlify?
R. Dá para fazer coisas parecidas, mas o ecossistema é mais fraco. Cloudflare e Netlify têm CLIs oficiais e integração com GitHub, mas em maio de 2026 não têm o equivalente a Vercel Agent Skills (MCP) como integração nativa com agentes. Em integração com IA, a Vercel está 6-12 meses à frente. Veja os critérios de seleção em A IA recomenda Vercel.
P. Claude Code vs Cursor para deploys na Vercel, qual é melhor?
R. Os dois suportam MCP e as capacidades são quase equivalentes. O Claude Code é centrado no terminal e traz integração oficial com GitHub Actions; o Cursor é centrado no IDE com UI intuitiva de slash commands. Quem é do VS Code tende ao Cursor; quem é do terminal tende ao Claude Code. Muita gente usa os dois.
P. Devo deixar a IA automatizar 100% os deploys de produção?
R. Não. Preview ou staging, automatize tudo, ótimo. Produção sempre deve exigir aprovação humana. Motivo: a IA pode quebrar produção por erros inocentes e "de quem é a responsabilidade depois de um incidente" fica ambíguo. Use GitHub Branch Protection para proibir push direto na main e exigir regras de aprovação.
P. O token do .cursor/mcp.json deve ir para o git?
R. De jeito nenhum. Coloque o diretório .cursor/ inteiro no .gitignore, ou leia .cursor/mcp.json a partir de variáveis de ambiente. Um vazamento do token da Vercel significa que terceiros podem fazer deploy no seu projeto à vontade: incidente crítico.
P. Estou preocupado com o custo da API do Claude pelo GitHub Actions.
R. Mais ou menos centavos a algumas dezenas de centavos por PR dependendo do tamanho do código, em geral alguns dólares por mês. Para evitar "loops infinitos da IA", configure um spending limit mensal na API da Anthropic. Claude Code Action v1.0 também já vem com limites de número de passos ativos por padrão.