- One component per file — file name matches component name (`PascalCase.tsx`) - Prefer functional components — no class components - Keep components under ~150 lines. If longer, extract sub-components or hooks - Single responsibility — a component does one thing well - Co-locate related files: `Component.tsx`, `Component.module.css`, `Component.test.tsx`, `useComponent.ts` - Export named components — avoid `export default` (harder to refactor, inconsistent imports) - Never define components inside other components — causes remount on every render
