Arquitetura Tecnica

Estrutura do Prototipo (web/)

Como as rotas e componentes estao organizados no diretorio web/ do projeto Romeo.

Versao: 1.0
Atualizado: junho/2026
Status: pronto

Visao geral

O diretorio web/ contem o front-end do Romeo, construido com Next.js 15 e App Router. E um prototipo funcional que demonstra todas as telas do sistema, com dados mockados em lib/mock/.

Stack
Next.js 15 · React 19 · TypeScript · Tailwind CSS · shadcn/ui · Radix UI

Estrutura de pastas

web/
├── app/                    # App Router (rotas)
│   ├── (public)/           # Rotas publicas (marketplace)
│   ├── app/                # Painel do corretor (/app/*)
│   ├── docs/               # Documentacao (/docs/*)
│   ├── inquilino/          # Portal do inquilino
│   ├── proprietario/       # Portal do proprietario
│   └── layout.tsx          # Layout raiz
├── components/             # Componentes React
│   ├── app/                # Componentes do painel
│   ├── docs/               # Componentes de documentacao
│   ├── layout/             # Header, sidebar, footer
│   ├── marketing/          # Landing pages
│   └── ui/                 # shadcn/ui + customizados
├── lib/                    # Utilitarios
│   ├── mock/               # Dados mockados
│   └── utils.ts            # Helpers gerais
├── public/                 # Assets estaticos
└── styles/                 # CSS global

App Router (rotas)

O Next.js App Router organiza rotas por pastas. Cada pasta com page.tsx vira uma rota.

Rota	Descricao	Layout
/	Marketplace publico	Publico
/imovel/[id]	Detalhe do imovel	Publico
/c/[slug]	Microsite do corretor	Microsite
/app	Dashboard do corretor	App (sidebar)
/app/imoveis	Lista de imoveis	App
/app/carteira	Carteira de clientes	App
/docs	Portal de documentacao	Docs
/inquilino	Central do inquilino	Portal
/proprietario	Portal do proprietario	Portal

Rotas com parenteses como (public) sao grupos de layout — nao aparecem na URL.

Organizacao de componentes

components/ui/

Componentes base do shadcn/ui e extensoes customizadas. Sao atomicos e reutilizaveis.

components/app/

Componentes especificos do painel do corretor: cards de imovel, timeline de atividades, graficos, etc. Podem conter logica de negocio.

components/layout/

Estrutura de pagina: header, sidebar, breadcrumbs. Usados nos layouts do App Router.

components/docs/

Primitivos tipograficos para documentacao: Section, Table, Callout, etc. Usados em todas as paginas /docs.

Utilitarios e lib/

Arquivo	Proposito
lib/utils.ts	Helpers gerais (cn, formatters)
lib/docs.ts	Registro de paginas de documentacao
lib/docs-md.ts	Parser de arquivos .md para /docs/tech
lib/mock/*.ts	Dados mockados para prototipo
lib/rbac.ts	Definicoes de papeis e permissoes

Regra
Arquivos em lib/ sao utilitarios puros — sem dependencia de React. Hooks ficam em hooks/.

Convencoes adotadas

Arquivos em kebab-case — meu-componente.tsx, nao MeuComponente.tsx
Exports nomeados — evitar export default exceto em pages
Colocation — componentes usados em uma so pagina ficam junto dela
Server Components por padrao — "use client" so quando necessario

Para detalhes completos de estilo, veja /docs/convencoes.