Kickstart React Native (Expo) — Blueprint do App em 30 minutos
Gera um plano de criação rápido e organizado para um app React Native com Expo: arquitetura, pastas, libs, padrões e checklist de entrega.
Dev
expo
mvp
typescript
mobile
react-native
arquitetura
iniciante
Preencha as variáveis
0/9 preenchidas
Preencha os campos abaixo e o prompt será atualizado automaticamente. Depois é só copiar!
{ai_tool}{app_name}{app_goal}{platform}{auth}{data_source}{main_screens}{navigation}{ui_style}Prompt (prévia ao vivo)
Você é um Arquiteto Mobile Sênior (React Native + TypeScript) e vai me guiar para criar um app do zero de forma rápida e organizada, usando {ai_tool}.
Contexto do app:
- Nome do app: {app_name}
- Objetivo (1 frase): {app_goal}
- Plataforma: {platform}
- Autenticação: {auth}
- Dados: {data_source}
- Telas principais: {main_screens}
- Navegação: {navigation}
- Estilo UI: {ui_style}
Regras e entrega (SEJA PRÁTICO e EXECUTÁVEL):
1) Gere um checklist de setup (Expo + TS) e comandos (pnpm/npm/yarn) para iniciar.
2) Sugira stack mínima (lib de navegação, form, validação, state, fetch/cache, env) com justificativa curta.
3) Defina a arquitetura e estrutura de pastas (com árvore), priorizando modularidade e escalabilidade.
4) Crie padrões de código: naming, organização de components, hooks, services, screens.
5) Crie um 'MVP Sprint Plan' em 5 passos (o que fazer primeiro, segundo...).
6) Gere os arquivos iniciais (apenas os essenciais) em blocos separados:
- app/_layout (se usar Expo Router) OU NavigationContainer (se usar React Navigation)
- 1 tela inicial funcional
- service/api (camada de API)
- env + exemplo de configuração
7) No final, gere um prompt curto 'COPIAR E COLAR' para eu enviar ao {ai_tool} pedindo para ele criar o projeto com a estrutura proposta.
Observações:
- Não invente integrações externas; se {data_source} for "mock", crie mocks locais.
- Priorize Expo (a menos que eu diga bare).
- Use TypeScript.
- Código limpo e direto.
Exemplos
Entrada
ai_tool: Windsurf app_name: FitTrack app_goal: Ajudar usuários a registrar treinos e acompanhar evolução platform: iOS e Android auth: e-mail+senha data_source: mock local main_screens: Login Home (lista de treinos) Criar Treino Detalhe do Treino Perfil navigation: Tabs + Stack ui_style: clean e moderno
Saída esperada
Checklist de setup:
1) npx create-expo-app FitTrack -t
2) pnpm add @tanstack/react-query zod react-hook-form ...
...
Arquitetura sugerida:
- Expo Router + feature-based modules
- src/features/* (screens, components, hooks, services)
- src/shared/* (ui, utils, theme)
Árvore de pastas:
src/
features/
auth/
workouts/
profile/
shared/
ui/
utils/
services/
api/
...
Arquivos essenciais:
[blocos com _layout, Home, api client, env]
Prompt COPIAR E COLAR para o Windsurf:
"Crie um app Expo + TS com a estrutura abaixo..."