- Nx 22.7 monorepo (pnpm 11.1, TypeScript 5.9, Node 24) - apps/api: NestJS 11 (CJS conforme CODING-RULES.md PGD-DB-004) - apps/web: React 19 + Vite 8 (ESM) - libs/shared/api-interface: Zod contract base - Docker Compose dev: Postgres 18, Valkey 8, MinIO, Mailpit - WDS artifacts: - design-artifacts/A-Product-Brief/ (5 docs canônicos + 16 dialogs) - design-artifacts/B-Trigger-Map/ (hub + 4 personas + feature impact) - Stack canon: STACK.md v2.2 + CODING-RULES.md v2.0 + brand.md - AGENTS.md + README.md como entrada para devs/agentes Co-Authored-By: Claude Opus 4.7 (1M context) <noreply@anthropic.com>
2.1 KiB
2.1 KiB
Content Placement Decision Tree
One-page flowchart for file placement
The Decision Tree
┌─────────────────────────────────────────────────┐
│ Does CONTENT vary by page context? │
│ (text, images, data source) │
└────────────┬────────────────────────────────────┘
│
┌──────┴──────┐
│ │
YES NO
│ │
▼ ▼
┌─────────────┐ ┌──────────────┐
│ Page File │ │ Feature File │
│ │ │ │
│ Document: │ │ Document: │
│ - Headings │ │ - Generic │
│ - Text │ │ content │
│ - Images │ │ - Default │
│ - Data API │ │ config │
│ - Scope │ │ │
└─────────────┘ └──────────────┘
Examples
Page File (Content Varies):
- ✅ Hero heading: "Welcome" (Home) vs "About" (About)
- ✅ Search placeholder: "Search products..." vs "Search help..."
- ✅ Calendar header: "Familjen Svensson: Vecka 40" (user's family)
- ✅ Data API:
/api/families/:currentFamilyId/walks(user-specific)
Feature File (Content Same Everywhere):
- ✅ Button text: "Submit" (always the same)
- ✅ Error message: "Invalid email" (generic validation)
- ✅ Tooltip: "Click to expand" (generic interaction)
- ✅ Data API:
/api/products(same for all users)
Visual Design?
Is this VISUAL design (colors, spacing, states)?
│
└─ YES → Component File
(Colors, typography, layout, states)
Quick Rule
- Page File = WHERE + WHAT (page-specific)
- Component File = HOW IT LOOKS (visual design)
- Feature File = WHAT IT DOES (functionality + generic content)