Como vibecodar de verdade

Vibe coding ganhou fama como sinônimo de “jogar um prompt na IA e ver o que acontece”. Na prática, isso produz código que funciona uma vez, em condições específicas, e quebra na primeira mudança.

O que realmente funciona é diferente: usar IA para acelerar cada etapa de um processo que você já entende. Sem o processo, a IA amplifica o caos. Com o processo, ela amplifica a velocidade.

Esse é o fluxo que uso.

1. Ideia → Detalhamento de requisitos

O primeiro erro é ir direto do “tenho uma ideia” para o editor. Antes de qualquer código, vale gastar tempo respondendo perguntas simples:

O que exatamente essa feature precisa fazer?
Quais são os casos de borda?
O que está fora do escopo?
Etc

Quando você chega na IA com um requisito vago (“faz um sistema de autenticação”), o resultado é genérico. Quando chega com requisitos claros (“autenticação com email/senha, JWT com refresh token, sem OAuth por enquanto”), o resultado é utilizável.

A IA é boa em preencher lacunas — o problema é que ela preenche silenciosamente, com suposições que podem não ser as suas.

2. Estudo de referências + definição da arquitetura

Se você nunca fez nada parecido, vale estudar como outros resolveram o mesmo problema antes de definir a arquitetura a fim de entender as decisões que já foram validadas.

Arquitetura definida depois que o código existe é muito mais cara de mudar. Definida antes, com a IA como interlocutora (“dado esses requisitos, quais abordagens arquiteturais fazem sentido e por quê?”), vira uma conversa produtiva.

Essa etapa é onde você decide: monolito ou módulos separados? State global ou local? API REST ou algo diferente? Etc

3. Estudo e definição das tecnologias

Com a arquitetura clara, a escolha de tecnologia fica mais objetiva. Você não está mais escolhendo “o que parece legal” — está escolhendo o que resolve o problema dentro das restrições que você definiu.

Perguntas úteis nessa etapa:

Essa lib ainda é mantida ativamente?
Ela tem o que preciso ou vou precisar de workarounds?
A curva de aprendizado vale dado o escopo do projeto?
Etc

A IA ajuda muito aqui — comparar opções, entender trade-offs, checar se a lib tem suporte para o seu caso específico. Não tem segredo, se você não souber é só perdir um norte pra I.A, e então estudar sobre.

4. Construção da estrutura do projeto

Monorepo ou não. Estrutura de pastas. Lint, formatação, CI. Configuração de TypeScript.

Vale caprichar aqui. Corrigir convenções de código depois que existem 50 arquivos é um trabalho que ninguém quer fazer.

5. Criação de testes

Testes antes das telas. Não necessariamente TDD puro — mas definir o que cada parte do sistema precisa fazer antes de construir as interfaces ajuda a separar lógica de apresentação desde o início.

Com testes definidos, a IA tem um critério de aceitação claro ao gerar código. Em vez de “gera uma função que calcula desconto”, você passa: “gera uma função que calcula desconto — os testes estão aqui”. O resultado é mais confiável.

6. Planejamento de cada tela

Antes de construir qualquer tela, vale fazer um mapeamento rápido:

Quais dados essa tela precisa?
Quais ações o usuário pode fazer?
O que acontece em cada estado (loading, erro, vazio, dados)?
Vale criar esse componente compartilhavel pra outras telas?
Etc

Esse planejamento pode ser um rascunho no papel, um wireframe simples ou até uma descrição em texto. Ele é pra você, e você vai pedir etapa por etapa pra IA. Lembre-se de não sobrecarregar ela de informações que aumenta a chance dela falhar.

7. Construção de cada tela + componentes compartilháveis

Aqui é onde a IA brilha de verdade. Com requisitos claros, arquitetura definida, tecnologias escolhidas e telas planejadas, cada prompt tem contexto suficiente para gerar código que se encaixa no que já existe.

Componentes compartilháveis emergem naturalmente conforme você constrói — quando percebe que está implementando a mesma coisa igual pela terceira vez, pode ser hora de extrair (YAGNI DRY KISS).

O ponto central de tudo isso: a IA não substitui o processo — ela acelera cada etapa dele. Quanto mais contexto e clareza você traz para cada prompt, melhor o resultado. O processo existe para criar esse contexto.

“Vibe coding” não é menos rigoroso — só é mais rápido. Ah e lembre-se de revisar cada etapa.