Vibe coding para iniciantes: do zero ao seu primeiro app
Vibe coding é descrever com palavras comuns o que você quer e deixar a IA escrever o código. Você olha o resultado, diz o que corrigir e repete o ciclo. O termo foi criado pelo pesquisador de IA Andrej Karpathy em fevereiro de 2025. Pense em você como produtor e na IA como programador: o produtor não toca todos os instrumentos, mas decide como a faixa vai ficar. Seu trabalho é decidir o que construir, conferir se funciona e escolher o próximo passo.
Curso grátis sobre o temaVibe coding: curso grátisComeçar o curso →
Aula: vibe coding, o que é e como fazer sites com IA
O que dá para criar e do que você precisa
Uma landing page (site de uma página), um bot de Telegram, uma calculadora, um minijogo, um rastreador de hábitos ou um portfólio. Para começar, basta um navegador e uma conta gratuita numa ferramenta de IA. Os planos grátis têm limites, mas costumam bastar para os primeiros projetos.
Passo 0: escolha o tipo de ferramenta
As ferramentas de IA para código são de três tipos:
- Construtor: você descreve em palavras e ganha um site funcionando no navegador. Lovable, Bolt, v0, Replit. O começo mais rápido, sem instalar nada, mas com menos controle. Ideal para protótipo ou landing page.
- Editor com IA: o projeto fica aberto como arquivos, e a IA sugere mudanças ao lado. Cursor, Windsurf, VS Code com Copilot. Você vê cada mudança e decide se aceita.
- Agente: recebe uma tarefa e muda arquivos e roda comandos sozinho. Claude Code, Codex e Gemini CLI trabalham no terminal. Máximo poder, mas sem Git e sem conferir o resultado é fácil perder a versão que funcionava.
Um caminho que funciona: faça o primeiro protótipo num construtor, exporte o código para o GitHub e continue num editor ou com um agente. Erro comum: pular todo dia para a ferramenta da moda. Melhor um projeto terminado do que cinco abandonados. Aula: construtor, editor ou agente
Passo 1: um plano de uma página
A IA não lê mentes. Peça «um app de academia» e talvez venham pagamento, chat e ranking, quando você só queria marcar treinos. Cinco linhas economizam horas: o objetivo numa frase, para quem é, três funções principais, o que não fazer agora e como saber que está pronto. Aula: primeiro o plano
Passo 2: descreva o resultado, uma função por vez
Não «faça um site», e sim o quê exatamente: «Site de uma página para uma cafeteria: cardápio, endereço, botão de pedido no Telegram, tema escuro, bom no celular». Depois peça uma função por vez: primeiro o esqueleto, depois o cardápio, depois o formulário. Um passo pequeno é fácil de conferir e de desfazer. Se algo quebrar, cole o erro inteiro, não «não funciona». Aula: como passar uma tarefa para a IA
Passo 3: salve, volte, publique
Salve cada versão que funciona (histórico de versões da ferramenta ou Git) para voltar atrás se um passo novo quebrar tudo. O deploy, ou seja, publicar o projeto para que outros abram por um link, é o último passo, quando tudo foi conferido. Hoje você conecta uma vez um repositório do GitHub a uma hospedagem, e cada push na branch principal publica a nova versão sozinho. Aula: hospedagem e deploy
Passo 4: teste você mesmo
«Pronto, tudo funciona!» vindo de um agente não é prova. Ele pode não ter rodado o código ou ter quebrado outra página. Abra a prévia no celular e no computador. Primeiro o caminho normal, depois o estranho: um mês sem dados, um nome enorme, toque duplo num botão. As coisas costumam quebrar no estranho. Peça ao agente para escrever testes automáticos para cada função nova. Aula: não confie só na palavra dele
Por que o vibe coding tem má fama: 4 erros
A IA escreve código que funciona, mas nem sempre é seguro. Estes quatro erros explicam a maioria das histórias de terror:
1. Chave no código. Uma chave de API no código da página ou num repositório público é achada por bots que varrem o GitHub, e quem paga as requisições deles é você. Segredos ficam só no servidor. Vazou uma chave? Revogue na hora e crie outra. Aula: chaves e segredos
2. Banco de dados sem regras de acesso. Qualquer um baixa os dados de todo mundo.
3. Painel de admin escondido só tirando o botão. O endereço /admin ainda pode ser digitado à mão. A checagem «é admin mesmo?» tem que acontecer no servidor a cada requisição.
4. Confiar no navegador. Com as ferramentas de desenvolvedor (F12), o usuário pode mudar qualquer requisição: o preço, o próprio id, o papel de «admin». O servidor confere quem está pedindo e calcula os preços ele mesmo. Aula: segurança do app
E o dinheiro: APIs de IA pagas cobram por tokens, e se uma turma inteira faz centenas de perguntas na véspera da prova, a conta aparece. Defina um limite de gastos e um alerta de cobrança quando o serviço permitir. Aula: dinheiro e limites
Perguntas frequentes
Vibe coding é ruim?
Não por si só. A má fama vem de projetos publicados sem conferir: chaves no código da página, bancos sem regras de acesso, checagem de admin só na interface. Se você testa cada função e guarda os segredos no servidor, é um jeito rápido e legítimo de criar.
Preciso saber programar para começar no vibe coding?
Não. Para um primeiro projeto bastam um navegador e uma conta grátis numa ferramenta de IA. Entender o que acontece ajuda a ver mais rápido onde a IA errou, por isso o curso explica Git, hospedagem e API com palavras simples.
Qual a melhor ferramenta de vibe coding para iniciantes?
Para a primeira noite, um construtor no navegador como Lovable, Bolt, v0 ou Replit: ele entrega uma página funcionando mais rápido e sem instalar nada. Quando o protótipo funcionar, leve o código para o GitHub e continue num editor com IA ou com um agente.
Curso grátis sobre o temaVibe coding: curso grátisComeçar o curso →