Aplicação de cadastro de membros da comunidade Café Bugado. Uma landing page completa com formulário validado, modais de feedback e integração com Supabase.
- React 19 + Vite 6
- TypeScript
- Tailwind CSS v4
- React Hook Form + Zod
- Supabase JS
- Lucide React
- Sonner (toasts)
- Cadastro de membros com validação completa (Zod + React Hook Form)
- LinkedIn e GitHub obrigatórios
- Campos únicos no banco: nome, e-mail, LinkedIn e GitHub
- Modal de boas-vindas personalizado após cadastro
- Modal de perfil duplicado com contato via WhatsApp
- Validação em tempo real com mensagens de erro por campo
- Contador de caracteres no campo "Sobre"
- Máscara de telefone no campo WhatsApp
- Responsivo para mobile, tablet e desktop
- Scrollbar customizada na cor da marca
git clone https://github.com/seu-usuario/cafe-bugado-talentos.git
cd cafe-bugado-talentos
npm installcp .env.example .envEdite o .env com suas credenciais do Supabase:
VITE_SUPABASE_URL=https://xxxxxxxxxxxxxxxxxxxx.supabase.co
VITE_SUPABASE_ANON_KEY=sua_chave_anonima_aqui- Acesse app.supabase.com
- Crie um novo projeto ou use um existente
- Vá em SQL Editor
- Execute os arquivos na ordem abaixo:
sql/schema.sql # Cria a tabela, trigger, RLS e índices
sql/migration_001_remove_profile_image.sql # Remove coluna profile_image_url
sql/migration_002_unique_constraints.sql # Adiciona constraints únicos
O schema irá:
- Criar a tabela
community_members - Configurar o trigger automático de
updated_at - Habilitar RLS com policies de INSERT público e SELECT autenticado
- Criar índices de performance
- Adicionar constraints únicos para nome, e-mail, LinkedIn e GitHub
npm run devAcesse: http://localhost:5173
| Comando | Descrição |
|---|---|
npm run dev |
Servidor de desenvolvimento |
npm run build |
Build de produção |
npm run preview |
Preview do build |
npm run lint |
Verificar linting |
src/
├── components/
│ ├── ui/ # Button, Input, Select, Textarea, FormField
│ │ # DuplicateModal, WelcomeModal
│ ├── sections/ # Hero, Benefits, MemberForm
│ └── layout/ # Footer
├── pages/ # Home
├── lib/ # Cliente Supabase
├── hooks/ # useRegisterMember
├── services/ # memberService (insert + tratamento de erros)
├── schemas/ # memberSchema (Zod)
├── types/ # member.ts
├── constants/ # Áreas, níveis, estados BR
└── utils/ # Máscara de WhatsApp
sql/
├── schema.sql
├── migration_001_remove_profile_image.sql
└── migration_002_unique_constraints.sql
| Campo | Obrigatório | Observação |
|---|---|---|
| Nome completo | Sim | Único no banco |
| Sim | Único no banco | |
| Cidade | Sim | — |
| Estado (UF) | Sim | — |
| Área de interesse | Sim | Select com 11 opções |
| Sobre você | Sim | Mín. 20 / máx. 600 caracteres |
| Sim | URL válida, único no banco | |
| GitHub | Sim | URL válida, único no banco |
| Portfólio | Não | URL válida |
| Não | Formato BR com máscara | |
| Cargo atual | Não | — |
| Nível de experiência | Não | Select |
| Disponibilidade | Não | Select |
| Aceitar termos | Sim | Obrigatório true |
- RLS habilitado no Supabase
- INSERT público permitido apenas para
anon - Leitura restrita a usuários autenticados
- Validação dupla: client (Zod) + banco (constraints únicos)
- Sem exposição de dados sensíveis no client
- Email: comunidade.cafebugado@gmail.com
- WhatsApp: +55 11 96188-9886
- Comunidade: cafebugado.com.br/comunidade
Compatível com Vercel, Netlify ou qualquer CDN estático.
npm run build
# dist/ pronto para deploy