What problem does it solve? Starting a new frontend feature without a clear technical plan leads to inconsistent module structures, misplaced business logic, and missed edge cases. This Skill produces a complete architecture plan before any code is written, covering files, services, hooks, routes, types, and UI states. ## Core Features & Use Cases - RSC Decision Matrix: Builds a Server vs Client Components table with technical justification for every new or modified component. - Data Flow Design: Traces the full path from page component through React Query hooks to HTTP services, with centralized query keys. - Direct-to-Disk Deliverable: Writes the full plan to .agents/plans/<feature>.md using an official template, keeping the chat response to a concise summary with business questions. - Use Case: Before building a new payments module, ask for an architecture plan and receive a document listing every file to create, the zod schemas for forms, the query keys to centralize, and the loading/empty/error states per screen. ## Quick Start Ask the agent to plan the architecture for a new feature, for example: plan the implementation of a payment requests module and write the plan to .agents/plans/.
