Vibe coding para iniciantes: como começar, passo a passo

Vibe coding para iniciantes se resume a cinco passos: escolher uma ferramenta que rode o app por você, descrever um app pequeno em palavras simples, testar como um usuário, pedir uma correção de cada vez e publicar quando funcionar. Você não precisa saber programar. Este tutorial percorre cada passo com um primeiro projeto de verdade, os prompts exatos para digitar e os erros que quase todo iniciante comete na primeira semana.

Se você quer entender o contexto antes, de onde veio o termo e por que as pessoas discutem sobre ele, leia o que é vibe coding. Esta página é o lado prático.

O que você precisa antes de começar

Menos do que imagina:

• Um navegador e uma conta em uma ferramenta de vibe coding. Iniciantes devem escolher um criador de apps com IA, que escreve o código, o executa e o hospeda, em vez de um assistente de código que espera que você gerencie arquivos e servidores.
• Uma ideia pequena. Não a sua startup. Uma ferramenta para uma pessoa (você) com uma ou duas telas.
• Uma ou duas horas sem interrupções. A primeira sessão ensina o ritmo.

É só isso. Sem instalar nada, sem curso de programação, sem terminal.

Qual ferramenta escolher como iniciante

A ferramenta importa menos que os hábitos, mas deve fazer três coisas: mostrar um preview ao vivo enquanto cria, deixar você desfazer uma mudança ruim e publicar em um link que você possa compartilhar. Nossa comparação das melhores ferramentas de vibe coding cobre as principais opções com honestidade. O Mythex é uma delas: você descreve o app no chat, ele cria um app full-stack de verdade com preview ao vivo, adiciona um banco de dados quando o app precisa lembrar de coisas e publica com um clique. O plano Free não pede cartão.

Passo 1: escolha um primeiro projeto que você consiga terminar

Iniciantes costumam falhar por mirar alto demais. Um bom primeiro projeto:

• É útil para você, então você vai testá-lo direito.
• Cabe em uma ou duas telas.
• Guarda uma pequena quantidade dos seus próprios dados.
• Não tem pagamentos, equipes nem dados pessoais sensíveis.

Bons primeiros projetos:

Vamos usar a lista de leitura no resto deste tutorial.

Passo 2: escreva seu primeiro prompt

Sua primeira mensagem define a forma de tudo. Diga para quem é, o que faz e qual deve ser a aparência. Mantenha em um parágrafo curto.

Um primeiro prompt fraco:

Faça um app de livros para mim.

Um bom primeiro prompt:

Crie um app de lista de leitura para mim. Posso adicionar um livro com título, autor e status (quero ler, lendo, terminado). Mostre os livros como cards agrupados por status, com os mais novos primeiro. Posso mudar o status de um livro ou excluí-lo. Deixe limpo e simples: fundo branco, uma cor de destaque, funcionando no meu celular. Salve os livros para que continuem lá depois de atualizar a página.

Repare no que o segundo faz. Ele lista os campos, as ações, o layout e uma regra que os iniciantes sempre esquecem: salvar os dados para que sobrevivam a uma atualização da página. Sem essa linha, muitas ferramentas criam uma página que parece pronta, mas esquece tudo quando você recarrega.

Para mais pontos de partida, veja nossa folha de prompts de vibe coding.

Peça um plano quando estiver em dúvida

Se você não sabe como descrever algo, peça à IA para planejar antes de construir:

Antes de construir qualquer coisa, me diga em palavras simples quais telas você vai criar, quais dados vai guardar e o que você precisa que eu decida.

No Mythex, é para isso que serve o modo Plan: o agente apresenta a abordagem e você a aprova antes de qualquer arquivo mudar.

Passo 3: teste como um usuário, não como quem construiu

Quando o preview aparecer, não fique só admirando. Use:

1. Adicione três livros, incluindo um com um título bem longo.
2. Mude um status. O card vai para o grupo certo?
3. Atualize a página. Os livros continuam lá?
4. Tente adicionar um livro com o título vazio. O que acontece?
5. Abra o preview no celular ou estreite a janela do navegador.

Anote o que está errado em palavras simples. "O título longo quebra o layout do card" é um relatório de bug perfeito. "Está quebrado" não é.

Passo 4: corrija uma coisa por mensagem

Este é o hábito que separa quem termina de quem desiste. Envie uma mudança, confira, depois envie a próxima.

O título longo "O Guia do Mochileiro das Galáxias: A Trilogia Completa" ultrapassa o card. Quebre títulos longos em duas linhas e corte o resto com "…".

Depois:

Se eu enviar o formulário com o título vazio, nada acontece e não aparece mensagem. Mostre "Adicione um título" embaixo do campo e não salve o livro.

Por que uma de cada vez? Quando você pede cinco mudanças em uma mensagem, a IA pode fazer quatro bem e quebrar outra coisa sem avisar, e você não saberá qual mudança causou isso. Passos pequenos também tornam o desfazer útil: se uma mudança der errado, volte à versão imediatamente anterior e tente um pedido mais claro.

Quando algo quebrar

Vai quebrar. Todo criador encontra erros. Copie o texto exato do erro, ou descreva exatamente o que você clicou e o que viu, e cole de volta:

Quando clico em Excluir em um card, vejo "Algo deu errado" e o livro continua lá. Descubra o motivo e corrija. Me diga qual foi a causa.

Pedir a causa importa. Isso ensina como os apps funcionam e impede a IA de chutar. Nosso guia sobre como depurar um app feito com IA vai mais fundo.

Passo 5: deixe com a sua cara

Quando funcionar, melhore no mesmo ritmo de passos pequenos:

• "Adicione uma avaliação de 1 a 5 estrelas que apareça nos livros terminados."
• "Adicione uma caixa de busca acima dos cards que filtre por título ou autor."
• "Use um fundo off-white quente e um destaque verde-escuro."
• "Adicione um contador no topo: livros terminados neste ano."

Cada um é uma única mudança testável.

Passo 6: publique e compartilhe

Quando fizer o que você precisa, publique. No Mythex é um clique, e você recebe uma URL pública que abre em qualquer dispositivo ou que dá para mandar a um amigo. Se depois você quiser seu próprio domínio, isso é um recurso do Pro, e nosso guia sobre como conectar um domínio personalizado explica como.

Antes de compartilhar com mais do que alguns amigos, leia vibe coding é seguro?. Para uma lista de leitura pessoal, o risco é baixo. Para um app em que desconhecidos se cadastram e guardam dados, há verificações a fazer antes.

Erros de iniciante para evitar

• Pedir tudo de uma vez. "Crie um Goodreads para mim" produz algo que parece impressionante e funciona mal. Comece com a menor versão útil.
• Não testar a atualização da página. Dados que somem ao recarregar são a surpresa mais comum para iniciantes.
• Reescrever o pedido do zero toda vez. Diga o que mudar e o que manter: "Mantenha o layout, mude só as cores."
• Confiar em "já corrigi". A IA muitas vezes diz que um bug foi corrigido. Confira você mesmo sempre.
• Colar senhas ou chaves de API no chat. Se o seu app precisa de uma chave para um serviço externo, coloque-a nas configurações de segredos da ferramenta, nunca em uma mensagem ou no código. Veja como manter chaves de API seguras.
• Desistir no primeiro erro. Erros são normais. Cole-os de volta e pergunte a causa.

O que aprender pelo caminho

Você não precisa de um curso, mas algumas ideias deixam cada pedido mais preciso. Peça à IA para explicá-las no contexto do seu próprio app:

• Frontend e backend: o que roda no navegador do visitante e o que roda em um servidor. (Frontend vs backend)
• Banco de dados: onde o app guarda seus dados. (O que é um banco de dados?)
• Autenticação: como o app sabe quem é cada pessoa.
• Segredos: chaves privadas que o app usa e que os visitantes nunca devem ver.

Um bom prompt para isso: "Explique como a minha lista de leitura salva um livro, do clique em Adicionar até os dados serem armazenados. Use palavras simples e cite os arquivos reais."

Seus segundo e terceiro projetos

Depois do primeiro app, escolha algo um degrau mais difícil. Um controle de hábitos com gráfico semanal. Um formulário de agendamento que envia e-mail para você. Um pequeno dashboard que lê de uma planilha do Google. Nossos exemplos de vibe coding mostram tipos reais de app com os prompts por trás e o que deu errado, e como criar um app com vibe coding leva um projeto maior da ideia a um app publicado com usuários.

Quando estiver pronto para começar, abra o criador de apps com IA, cole o prompt da lista de leitura acima e adapte para a sua própria ideia.

Perguntas