Como criar sistema de lista de espera
Um guia completo com integração de front-end, Supabase, autenticação e uso do modelo GPT-5 no fluxo de desenvolvimento com Cursor e Claude code.
Por que isso é importante
Como criar sistema de lista de espera. Um guia completo com integração de front-end, Supabase, autenticação e uso do modelo GPT-5 no fluxo de desenvolvimento com Cursor e Claude code.
Montando o Front-End com Skip
Comecei criando o front com Skip, ferramenta brasileira focada em velocidade. Depois de pronto, baixei o código-fonte.
Exportando o Código e Iniciando com Cursor
Com o front pronto, migrei pro Cursor. Implementei a lógica usando Claude code e MCP pra conectar com Supabase. Depois testei um fluxo novo com GPT-5 direto no Cursor.
Configurando o Claude code e MCP
No começo, MCP só rodava no Cloud. Depois vi que precisava adaptar pro Cursor também, mantendo contexto e histórico iguais nas duas plataformas.
Atenção
Configurações mudam por sistema operacional. Paths, permissões e autenticações precisam de atenção, principalmente no Windows.
Criação do Banco de Dados no Supabase
Criei a estrutura de dados com DB Expert e exportei pro Supabase. Garantiu ponto de partida sólido e fácil de modificar depois.
Usando GPT-5 dentro do Cursor
Com a estrutura no ar, usei GPT-5 pra implementar verificação, cadastro condicional e manipulação de banco com regras dinâmicas.
Info Técnica
GPT-5 é mais lento que Claude code, mas entrega respostas melhores no contexto e decisões mais precisas baseadas em interações anteriores.
Criação de Fluxo Contínuo de Cadastro
Criei uma tela antes da principal pra captar e-mails. A lógica checa se o e-mail já tá na lista de espera e redireciona certo em cada caso.
Geração de Código de Indicação
Com base no e-mail cadastrado, gerei um código único de indicação automaticamente. Cada usuário pode indicar outros e crescer a base organicamente.
Atenção
Esse código fica associado ao usuário e pode virar parâmetro em URLs. Aumenta efetividade e rastreio das indicações.
Validação com Número de Celular
Pra evitar fraude com múltiplos e-mails, adicionei campo de celular. Se o e-mail já tá registrado com outro número, aplicação bloqueia até validar direito.
Verificação de E-mail com Resend
Integrei Resend via função customizada no Supabase pra validar e-mail antes de contar indicação. Só depois da confirmação o usuário entra na base como indicado.
Integração com domínio
Domínio precisa estar configurado certo no Cloudflare senão os e-mails do Resend caem direto no spam.
Deploy na Vercel e Escolha da Ferramenta Final
Depois de todos os testes passarem, publiquei na Vercel. Cursor com GPT-5 trouxe insights legais, mas preferi Claude code pela velocidade e integração melhor.
Claude code
Experiência consistente e rápida com bom histórico de uso
Prós
- Respostas mais rápidas
- Menor latência
- Melhor integração com design system
Contras
- Menor criatividade nas soluções geradas
Cursor + GPT-5
Aproximação criativa, ideal para brainstorming de lógica
Prós
- Melhor adaptação por contexto
- Soluções alternativas
- Refinamento de lógica
Contras
- Tempo de execução maior
- Maior uso de recursos
Checklist de Implementação
Transforme sua carreira
E foi EXATAMENTE por isso que eu criei um curso de Node.js e React chamado CrazyStack. A minha maior necessidade no início da carreira era alguém que me ensinasse um projeto prático onde eu pudesse não só desenvolver minhas habilidades de dev como também lançar algo pronto para entrar no ar no dia seguinte.
Sabe qual era minha maior dor? Aplicar conhecimento teórico em projetos reais, mas não achar ninguém que ensinasse COMO fazer na prática. Mesma dor que você deve ter: acumula informação mas não sabe implementar.
Do mesmo jeito que você precisa de estratégia clara e implementação prática, todo dev precisa de projeto estruturado pra sair da teoria. É tipo ter todas as peças do quebra-cabeça mas não saber montar — conhecimento técnico sem projeto completo não vira resultado concreto.
No CrazyStack, você constrói um SaaS completo do zero - backend robusto em Node.js, frontend moderno em React, autenticação, pagamentos, deploy, tudo funcionando. É o projeto que eu queria ter quando comecei: algo que você termina e pode colocar no ar no mesmo dia, começar a validar com usuários reais e até monetizar.
Continue lendo
Como instalar e usar o Codex CLI e Extensão com Supabase, DB Expert e VS Code
Como instalar o Codex CLI, configurar MCPs customizados, usar a extensão Codex para VS Code, integrar com...
Como criar aplicativos com banco de dados embutido usando Mocha
Como acelerar o desenvolvimento unindo front-end e banco de dados facilmente com o Mocha. Ferramenta ideal...
GPT-5 vs Claude code: quem gera melhor uma aplicação com Tailwind?
Exploramos como inteligência artificial se comporta ao gerar um projeto completo com React, Vite, TypeScript e Tailwind.
Workflow Ágil com AI: Método BMAD
A simular equipes inteiras de desenvolvimento diretamente na sua IDE com o incrível método BMAD. Transforme...