frontend-developmentlisted

# Frontend Development Active workflow knowledge for building frontend applications with React, Next.js, TypeScript, Tailwind, and frontend tooling (Biome, ESLint, Prettier). ## Core Principles (See detailed in references) ### 1. Server-First Architecture Start with Server Components. Only add `'use client'` when you need interactivity, state, or browser APIs. Keep client boundaries as small as possible—extract only the interactive leaf, not the entire page. ### 2. Colocation Over Centralization Keep code close to where it's used. Types, hooks, and utilities that serve one feature live in that feature's directory. Only truly shared code goes in global directories. This reduces cognitive load and makes features self-contained. ### 3. Searchable, Specific Naming Every file should be findable with a single grep. Use `login-form.tsx` not `form.tsx`. Use `user-profile-types.ts` not `types.ts`. Generic names create needle-in-haystack problems at scale. ### 4. Composition Over Customization Prefer composing existing components over adding props/variants. shadcn/ui components are meant to be copied and modified—don't fight against this. Build up from primitives rather than configuring monoliths. ### 5. Data Flows Down, Events Flow Up Server fetches data and passes it as props. Client components handle interactions and call server actions or mutations. Never fetch in client components what could be fetched on the server. ## Quick Start 1. **Check file structure first** - Doe