Construtor de Páginas de Destino SaaS Full-Stack
De Wikiprompt, a enciclopédia livre de prompts
Construtor de Páginas de Destino SaaS Full-Stack Um prompt abrangente para gerar uma landing page de SaaS pronta para produção, com recursos full-stack, incluindo pagamentos Stripe, autenticação e fluxos de e-mail.
Conteúdo do PromptSalvar
🌐
Sou um desenvolvedor full-stack sênior. Construa para mim uma página de destino [tipo de produto] pronta para produção com as seguintes especificações:
REQUISITOS DE FRONTEND:
- Seção hero com título atraente: [sua proposta de valor], subtítulo e botão de CTA
- Seção de recursos com 6 benefícios usando formato ícone + título + descrição
- Tabela comparativa de preços interativa com 3 níveis (destacar o nível intermediário)
- Seção de prova social com cartões de depoimentos e logotipos de empresas
- Acordeão de FAQ com 8 objeções comuns respondidas
- Formulário de captura de e-mail com validação em tempo real
- Design responsivo para dispositivos móveis (breakpoints para celular, tablet, desktop)
- Usar React 18, TypeScript, Tailwind CSS e Framer Motion para animações
REQUISITOS DE BACKEND:
- Integração de pagamento Stripe com tratamento de webhook para assinaturas
- Integração da API ConvertKit para gerenciamento de lista de e-mail
- Autenticação de usuário com NextAuth.js (e-mail + Google OAuth)
- Esquema de banco de dados PostgreSQL para usuários e assinaturas
- Rotas de API para: cadastro de usuário, processamento de pagamento, gerenciamento de assinatura
ENTREGÁVEIS:
- Estrutura de arquivos completa com todos os componentes
- Guia de configuração de variáveis de ambiente
- Instruções de implantação para Vercel
- Código comentado explicando a lógica principal
- Package.json com todas as dependências
Comece com a estrutura de arquivos e depois construa cada componente sistematicamente.
Entre para ver o prompt completo
Continuar com:
Ao entrar, você concorda com nossos Termos de uso e Política de privacidade
Uso
Este prompt foi projetado para uso com coding. Copie o conteúdo acima e cole na sua ferramenta de IA preferida.
Para melhores resultados, personalize os marcadores (indicados por colchetes ou maiúsculas) com seus requisitos específicos.
Discussão
0 comentários