What problem does it solve? Frontend work often drifts into inconsistent layering, duplicated contracts, and ad-hoc state or error handling. This Skill enforces a coherent client architecture by routing each task—design, review, scaffolding, testing, or refactoring—through only the relevant architecture slices. ## Core Features & Use Cases - Slice-based routing: Load only the references needed for the task, covering scaffolding, foundations, contracts, data flow, state/realtime, telemetry, testing, React, and Next.js. - Enforced invariants: Preserves the canonical chain (components -> query adapter -> featureApi -> clientApi -> network), shared Zod wire contracts, normalized AppError handling, and separated logging versus product analytics. - Framework-agnostic core: React and Next.js are documented specializations, but unlisted frameworks are supported by deriving integrations from repository evidence and official documentation. - Use Case: When asked to scaffold a new profile-editing feature in a Next.js app, the Skill loads scaffolding, contracts, data-flow, react, nextjs, and testing slices, then generates the feature API, hooks, form, and mirrored tests without duplicating existing infrastructure. ## Quick Start Use $client to scaffold a new feature or review this frontend code against the repository's client architecture slices.
