Confiar no que a IA constrói|INEMA.CLUB-PRO

Aula 3 · 20 min

Vibe coding pelo lado da confiança: construa um app e procure as falhas

Vibe coding é pedir um programa em português e deixar a IA escrever o código. Funciona: em minutos sai um app que abre e parece pronto. O problema é que "abriu" não quer dizer "está seguro". Nesta aula você constrói um app de uma tela, com segurança, e depois troca de papel: vira quem procura as falhas.

Começar a aula
Mãos num notebook com um aplicativo simples aberto; ao lado, bilhetes adesivos com sinais de alerta, uma lupa e um caderno.

Nesta aula você vai

  1. 1Construir um app de 1 tela com Claude Code, Codex ou ChatGPT
  2. 2As regras para praticar sem risco
  3. 3Testar como usuário e como quem quer abusar
  4. 4Pedir uma auditoria à IA e conferir você mesmo

Objetivo: construir com IA um app de 1 tela que roda no seu computador e listar 3 falhas que você achou nele, com o lugar de cada uma.

01O ciclo de quem constrói com confiança

Construir é a metade fácil. A outra metade é procurar o que quebra.

Clique em cada etapa.

O app que "abriu" é o começo da conferência, não o fim.

02Passo a passo da prática

Escolha um caminho: Claude Code, Codex ou ChatGPT. O resto é igual.

1. Preparar

Crie uma pasta só para o teste, por exemplo teste-horizonte. Use só clientes inventados e a chave falsa CHAVE-DE-TESTE-123.

Nada de publicar: o app roda só no seu computador, abrindo o arquivo no navegador.

03Modelos para copiar

As regras, o pedido do app, a auditoria e a lista de falhas.

Regras da prática (cole antes de tudo)
Regras deste teste:
- Trabalhe só dentro desta pasta. Não apague nada fora dela.
- Use apenas dados inventados. Nenhum nome, CPF ou telefone real.
- Não publique nada na internet e não instale nada fora da pasta.
- A única chave permitida é a falsa: CHAVE-DE-TESTE-123.
- No fim, diga o que você criou e como eu abro.
Pedido do app (1 tela)
Crie um app de uma tela só, num único arquivo index.html que abre direto no navegador, sem servidor.

É o formulário de pedidos da Horizonte Distribuidora (produtos de limpeza):
- Campos: cliente, produto (lista com 5 produtos inventados e preço), quantidade.
- Botão "Adicionar pedido". Abaixo, a lista de pedidos com o total em R$.
- Guarde os pedidos no próprio navegador, para não sumirem ao recarregar.
- Um botão "Área do gerente" que mostra todos os pedidos e permite apagar.
- Ao adicionar, "envie" o pedido para a API de estoque usando a chave CHAVE-DE-TESTE-123 (pode ser só simulado).

Visual simples e legível no celular. Explique em 5 linhas como o app funciona.
Prompt de auditoria (conversa nova)
Você é um revisor de segurança. Analise o código abaixo, de um app feito com IA.
Procure, nesta ordem:
1. Chaves, senhas ou tokens visíveis no código que roda no navegador.
2. Áreas ou ações que deveriam exigir login e não exigem.
3. Dados que qualquer pessoa com o link consegue ver ou apagar.
4. Entradas não validadas (quantidade 0, preço negativo, texto enorme, código no campo).
5. Bibliotecas externas: quais são, de onde vêm e se a versão é antiga.
6. Dados pessoais guardados sem necessidade.

Para cada falha: o que é, a linha ou trecho, a gravidade (alta/média/baixa) e como corrigir.
Não invente: se não der para confirmar pelo código, diga "não confirmado".

CÓDIGO:
<cole aqui o conteúdo do index.html>
Lista de falhas (sua entrega)
FALHAS DO APP — <seu nome>, <data>, feito com <Claude Code | Codex | ChatGPT>

| # | Falha | Onde está (linha ou print) | Como achei (uso / código / auditoria) | Gravidade | O que pedir para corrigir |
|---|---|---|---|---|---|
| 1 | | | | | |
| 2 | | | | | |
| 3 | | | | | |

A auditoria da IA apontou algo que NÃO estava no código? <sim/não, qual>
Simulação: exemplo ilustrativo
  • Chave no código do navegador: a CHAVE-DE-TESTE-123 aparece no Ctrl+U. Se fosse real, qualquer visitante copiaria.
  • Área do gerente sem login: um botão aberto a todos, que apaga pedidos.
  • Sem validação: aceita quantidade 0 e preço negativo; o total fica errado.
  • Biblioteca externa carregada da internet, sem versão fixa.

04Por que isso importa fora da sala de aula

Em maio de 2026 a empresa de segurança Red Access disse ter encontrado cerca de 380 mil páginas e apps públicos feitos com ferramentas como Lovable, Replit, Netlify e Base44; cerca de 5 mil deles expunham informação possivelmente sensível, como documentos financeiros e conversas de atendimento. As plataformas contestaram parte da leitura: app público visível não é, por si só, um vazamento.

A lição para você não depende de quem tem razão: quem constrói rápido com IA precisa perguntar, antes de publicar, quem consegue ver e fazer o quê. É exatamente o que esta aula treina e o que a aula 4 pede na empresa-laboratório.

05Prática: construa e audite

Uns 60 minutos no total. Faça na ordem.

E1 · Pasta e regras

5 min

Crie a pasta teste-horizonte e cole as regras da prática no começo da conversa com a IA.

Pronto quando: a pasta existe e a IA confirmou as regras antes de construir.

E2 · O app rodando

20 min

Use o pedido do app no caminho que escolheu. Abra o index.html no navegador e cadastre 3 pedidos.

Pronto quando: o app abre no seu navegador e mostra 3 pedidos com o total em R$.

E3 · Usar e abusar

10 min

Teste quantidade 0, preço negativo, campo vazio, texto enorme e a área do gerente.

Pronto quando: você anotou o que o app aceitou e não deveria (ou que recusou tudo).

E4 · Auditoria e lista de falhas

25 min

Procure no código-fonte, rode o prompt de auditoria numa conversa nova e confira cada item no código.

Pronto quando: a lista tem 3 falhas, cada uma com a linha ou o print de onde está e como você achou.

Quer ir mais fundo em construção? O curso Vibe Coding: Domínio Completo cobre o caminho até a produção.

06Teste o que aprendeu

A explicação aparece depois da sua resposta.

Pergunta 1 de 4

O app abriu, salvou os pedidos e mostrou o total certo. O que isso prova?competência

07Resumo da aula

Abriu ≠ seguroO caminho feliz é o começo da conferência.
Pratique sem riscoPasta própria, dado inventado, chave falsa, nada publicado.
Use e abuseZero, negativo, vazio, enorme e a área que devia ter login.
Auditoria de foraConversa nova e você confere cada item no código.

Fontes e para ir além

Aula anteriorPróxima aula