Desenvolvimento com IA
Fluxo de depuração com vibe coding
Um fluxo prático para depurar aplicativos feitos com vibe coding, com relatórios de bug reproduzíveis, análise de causa raiz, testes de regressão, prompts de programação com IA e correções mais seguras.
Depurar aplicativos feitos com vibe coding é diferente de depurar código que você escreveu linha por linha. A IA pode ter criado arquivos, fluxos de estado, funções auxiliares, regras de estilo e premissas sobre dados mais rapidamente do que você conseguiria inspecioná-los. Se pedir uma correção rápido demais, a ferramenta poderá corrigir sintomas e criar um segundo bug.
Este guia mostra um fluxo de depuração repetível para aplicativos feitos com vibe coding: reproduza o bug, isole o comportamento, identifique a causa raiz, adicione um teste de regressão quando for prático, faça a menor correção e verifique o caminho original do usuário. O objetivo é utilizar ferramentas de programação com IA para depurar sem deixá-las reescrever metade do aplicativo.
Para quem este guia é indicado
- Fundadores que desenvolveram um protótipo com IA e agora precisam corrigir comportamentos quebrados
- Desenvolvedores que revisam código de aplicativo gerado por IA antes do lançamento
- Designers e profissionais de operações que utilizam construtores de aplicativos com IA e precisam de relatórios de bug mais claros para revisão técnica
- Equipes de produto que transformam protótipos feitos com vibe coding em aplicativos sustentáveis
- Qualquer pessoa que queira prompts de depuração com IA que reduzam refatorações aleatórias
Fluxo de trabalho passo a passo
- Reproduza o bug com etapas exatas, URL inicial, estado da conta, navegador, valores de entrada e resultado esperado.
- Registre o resultado real com uma mensagem de erro, descrição da captura de tela, saída do console ou teste com falha.
- Peça à IA que inspecione os arquivos relevantes antes de editar.
- Exija uma explicação da causa raiz que nomeie a premissa quebrada, função, componente, rota, consulta ou regra de estilo.
- Peça a menor correção que preserve o comportamento existente.
- Adicione um teste de regressão para rotas, validação, gravações de dados, autenticação, cobrança, SEO ou comportamento importante da interface, quando for prático.
- Execute o teste direcionado ou o caminho de reprodução manual.
- Verifique o diff em busca de refatorações sem relação, mudanças de dependências, reescritas amplas ou mudanças de ambiente.
- Execute novamente o caminho original do usuário após a correção.
- Salve o relatório de bug e o prompt de correção para que problemas semelhantes sejam mais fáceis de diagnosticar na próxima vez.
Ferramentas recomendadas
- Claude para leitura da base de código, análise de causa raiz e planejamento cuidadoso de correções
- ChatGPT para reescrever relatórios de bug confusos em prompts de depuração claros
- Cursor para edições locais de código, pesquisa e depuração orientada por testes
- Lovable para iteração de protótipo quando o aplicativo ainda está no início
- v0 para isolar comportamento de componentes de interface e problemas de estado visual
Modelo de prompt de depuração
Utilize este prompt quando um aplicativo gerado por IA se comportar incorretamente:
Preciso depurar este bug em um aplicativo feito com vibe coding: [descrição do bug]. Reproduza o bug a partir destas etapas: [etapas]. Resultado esperado: [esperado]. Resultado real: [real]. Antes de editar arquivos, inspecione a rota, o componente, o estado, a API e o código de estilo relevantes. Explique a causa raiz em termos concretos. Em seguida, proponha a menor correção e o comando de verificação ou caminho manual que prove que o bug foi corrigido. Não refatore código sem relação nem altere variáveis de ambiente.
Se isto afetar o comportamento, adicione ou atualize um teste de regressão antes de implementar a correção. Após a correção, resuma os arquivos exatos alterados e o risco restante.
Lista de verificação do relatório de bug
- Qual página ou rota mostra o bug?
- Qual ação exata da pessoa usuária o aciona?
- Quais valores de entrada foram utilizados?
- O problema é visual, relacionado ao estado, à API, à autenticação, aos dados ou ao build?
- O que você esperava que acontecesse?
- O que realmente aconteceu?
- Ele acontece em dispositivos móveis, desktop ou ambos?
- Há erro no console, erro de rede, log do servidor, teste com falha ou saída de build quebrada?
- O que mudou recentemente antes de o bug aparecer?
Erros comuns
- Pedir à IA para "corrigir isto" sem etapas de reprodução
- Deixar a IA reescrever um componente inteiro quando uma condição de estado está errada
- Ignorar o código gerado porque a interface parece simples
- Corrigir sintomas de estilo quando o bug real é o formato dos dados ou a renderização condicional
- Aceitar uma correção sem executar o caminho que falhava originalmente
- Pular testes de regressão para fluxos de trabalho importantes
- Alterar variáveis de ambiente ou dependências como atalho de depuração
Exemplo prático
Prompt fraco: o botão Salvar não funciona, corrija-o.
Prompt melhor: na página de detalhes do prompt, clicar em Salvar enquanto a pessoa está autenticada mostra uma notificação de sucesso, mas o item salvo não aparece no histórico após atualizar a página. Reproduza o bug com uma pessoa autenticada, inspecione o botão Salvar, a rota de API, o auxiliar de persistência e a consulta de histórico. Explique se o problema está no estado do cliente, payload da API, gravação no banco de dados ou filtragem do histórico. Adicione um teste de regressão se o comportamento da rota estiver errado, faça a menor correção e depois execute o teste direcionado e descreva o caminho de verificação manual.
O prompt melhor fornece à IA um caminho concreto, resultado esperado, resultado real, arquivos para inspecionar, exigência de causa raiz e nível de verificação.
Perguntas frequentes
P: Devo deixar a IA refatorar enquanto corrige um bug? R: Normalmente não. Corrija primeiro o bug. Refatore somente depois que o comportamento estiver protegido por um teste ou por um caminho claro de verificação manual.
P: E se eu não conseguir escrever um teste para o bug? R: Utilize um caminho preciso de reprodução manual. Para problemas de interface, inclua viewport, estado, valores de entrada e o comportamento visual esperado exato.
P: Como impedir que a IA altere arquivos demais? R: Diga para ela inspecionar primeiro, explicar a causa raiz, propor a menor correção e evitar refatorações sem relação, dependências, migrações e mudanças de ambiente.
P: Por que a depuração de código feito com vibe coding parece confusa? R: Código gerado por IA pode esconder premissas entre componentes, estado, chamadas de API e estilos. A depuração funciona melhor quando você desacelera a ferramenta e exige que ela explique a cadeia de comportamento.