Ana Leite CS — Landing Page & Admin

Sobre o Projeto

Sistema completo para Ana Leite, especialista em Customer Success: uma landing page de alta conversão integrada a um painel admin dedicado para gerenciar conteúdo, visualizar leads e acompanhar métricas de acesso — tudo sem depender de terceiros para operações do dia a dia.

Landing Page

Construída com Astro em modo híbrido: páginas pré-renderizadas em HTML puro no build, com funções serverless na Cloudflare para processar formulários. Resultado: carregamento quase instantâneo e zero custo de servidor para o conteúdo estático.

• Três páginas distintas: página principal de captação, hub de links estilo Linktree e página de download de framework gratuito
• Imagens otimizadas automaticamente para WebP no build, com fontes pré-carregadas para eliminar flashes de layout
• Animações de scroll e carrossel infinito feitas em CSS puro — sem bibliotecas externas, sem peso desnecessário
• Proteção contra bots via Cloudflare Turnstile nos formulários de captação
• Leads salvos no Supabase e notificações disparadas via Resend com templates customizados
• Coleta de dados geográficos (país, cidade, fuso horário) via cabeçalhos nativos da Cloudflare para análise de audiência

Painel Admin

Dashboard full-stack em Next.js 15 com App Router e Server Components, hospedado no Cloudflare. Acesso restrito via Google OAuth — só e-mails cadastrados na base conseguem entrar, com dois níveis de permissão (admin e super_admin).

• Gerenciamento completo de links: criar, editar, reordenar por arrastar e soltar, com persistência imediata no banco
• Editor de ponto focal de imagem integrado: o admin recorta a foto no formato exato do card e define qual área deve aparecer em destaque — sem depender de ferramentas externas
• Imagens armazenadas no Cloudflare R2 (compatível com S3) via upload direto do browser, sem passar pelo servidor
• Visualização de leads e diagnósticos capturados pela landing page
• Dashboard de analytics com gráficos dos últimos 30 dias: acessos por data, por página, por país e por hora (Recharts)
• Mutações de dados via Server Actions do Next.js — sem camada de API separada, com revalidação de cache automática

Arquitetura Compartilhada

Landing page e admin compartilham o mesmo Supabase como fonte de verdade: o que o admin publica aparece imediatamente na landing page. A comunicação entre os dois sistemas é feita diretamente via banco — sem webhooks, sem sincronização manual.