feat: add full project - backend, frontend, docker, specs and configs

specs/021-pagina-sobre/quickstart.md

@@ -0,0 +1,98 @@
+# Quickstart: Página Sobre
+
+**Feature**: 021-pagina-sobre  
+**Branch**: `master` (branch recomendada para esta feature: `feat/021-pagina-sobre`)
+
+---
+
+## Pré-requisitos
+
+- Node.js instalado
+- Dependências do frontend instaladas: `cd frontend && npm install`
+- Docker não é necessário — feature 100% estática, sem backend
+
+---
+
+## Arquivos envolvidos
+
+| Ação | Arquivo |
+|------|---------|
+| **Criar** | `frontend/src/pages/AboutPage.tsx` |
+| **Modificar** | `frontend/src/App.tsx` (1 import + 1 `<Route>`) |
+| **Modificar** | `frontend/src/components/Footer.tsx` (link `#sobre` → `<Link to="/sobre">`) |
+
+---
+
+## Como rodar o frontend em dev
+
+```powershell
+cd frontend
+npm run dev
+```
+
+Acesse `http://localhost:5173/sobre` para ver a nova página.
+
+---
+
+## Passo a passo de implementação
+
+### Passo 1 — Criar `AboutPage.tsx`
+
+Criar o arquivo `frontend/src/pages/AboutPage.tsx` seguindo o padrão de `PrivacyPolicyPage.tsx`:
+- Sem props, sem estado, sem hooks
+- Estrutura: `<Navbar />` + `<main>` com 6 seções + `<Footer />`
+- Importar `Link` de `react-router-dom` para CTAs internos
+- Usar tokens do DESIGN.md (ver `data-model.md` — seção "Design tokens")
+
+Seções que usam `.map()` sobre array local:
+- **Diferenciais**: array `diferenciais: DiferencialItem[]` com 3 itens
+- **Números**: array `numeros: MetricItem[]` com 4 itens
+
+Seções implementadas como JSX direto:
+- Hero, Nossa História, Nossa Equipe, CTA Final
+
+### Passo 2 — Registrar rota em `App.tsx`
+
+```diff
+import AgentsPage from './pages/AgentsPage';
+import PrivacyPolicyPage from './pages/PrivacyPolicyPage';
++import AboutPage from './pages/AboutPage';
+// ...
+<Route path="/politica-de-privacidade" element={<PrivacyPolicyPage />} />
++<Route path="/sobre" element={<AboutPage />} />
+```
+
+### Passo 3 — Atualizar Footer
+
+Em `Footer.tsx`, converter o link "Sobre" de `<a href="#sobre">` para `<Link to="/sobre">`.
+
+Garantir que `Link` está importado de `react-router-dom` (provavelmente já está após feature 020).
+
+---
+
+## Checklist de validação manual
+
+Após implementar, verificar:
+
+- [ ] `http://localhost:5173/sobre` carrega sem erros de console
+- [ ] As 6 seções são visíveis (Hero, História, Diferenciais, Números, Equipe, CTA)
+- [ ] Navbar e Footer são exibidos corretamente
+- [ ] Link "Sobre" no Footer navega para `/sobre` sem recarregar a página
+- [ ] Botão "Ver imóveis disponíveis" navega para `/imoveis`
+- [ ] Link "Conheça nosso time" navega para `/corretores`
+- [ ] Link WhatsApp abre `wa.me` (verificar URL em inspeção de elemento)
+- [ ] Layout responsivo funciona em 375 px (mobile) e 1280 px (desktop)
+- [ ] Estilo visual consistente com `PrivacyPolicyPage` e demais páginas
+
+---
+
+## Critérios de aceite (mapeados da spec)
+
+| Critério | Como verificar |
+|----------|---------------|
+| SC-001: `/sobre` acessível sem auth | Abrir em aba anônima |
+| SC-002: Responsivo 320–1920 px | DevTools → breakpoints 320, 375, 768, 1280, 1920 |
+| SC-003: Footer "Sobre" → `/sobre` | Clicar no link e confirmar URL sem reload |
+| SC-004: CTAs corretos | Clicar em cada um e verificar destino |
+| SC-005: Sem erros de console | Console limpo após carregamento |
+| SC-006: Performance equivalente | Primeira renderização comparável a `/politica-de-privacidade` |