Loading...
Loading...
Found 24 Skills
React architecture patterns, TypeScript, Next.js, hooks, and testing. Use when working with React component structure, state management, Next.js routing, Vitest, React Testing Library, or reviewing React code. For visual design and aesthetic direction, use frontend-design instead.
React/TypeScript frontend implementation patterns. Use during the implementation phase when creating or modifying React components, custom hooks, pages, data fetching logic with TanStack Query, forms, or routing. Covers component structure, hooks rules, custom hook design (useAuth, useDebounce, usePagination), TypeScript strict-mode conventions, form handling, accessibility requirements, and project structure. Does NOT cover testing (use react-testing-patterns), E2E testing (use e2e-testing), or deployment.
Zod 4 schema validation best practices for type safety, parsing, and error handling. Use when defining schemas, validating string formats, calling safeParse, formatting Zod errors, or inferring input/output types. React Hook Form integration is covered by the react-hook-form skill.
Current TypeScript guidance, including TypeScript 7 migration, tsconfig design, type errors, declaration performance, async patterns, module organization, and runtime type safety. Use for .ts, .tsx, and .d.ts work; framework-specific patterns and testing are covered by their dedicated skills.
Current Next.js 16 App Router guidance for caching, Cache Components, Server Components, routing, Server Actions, and next.config.js. Use for Next.js 16.x code. Generic React 19 patterns are covered by the react skill.
Current shadcn/ui component guidance for projects generated with Radix UI or Base UI, including primitive-specific composition, Tailwind CSS v4 theming, accessibility, forms, tables, and state patterns. Inspect the checked-in component implementation before applying Radix asChild or Base UI render APIs.
Current React 19.2 guidance for concurrent rendering, Server Components, Actions, effects, React Compiler, state, and memoization. Use for React components and hooks. Next.js-specific routing/caching belongs to the nextjs skill; React Hook Form integration belongs to react-hook-form.
Current Vitest 4 guidance for setup, async tests, vi mocks, snapshots, worker pools, environments, assertions, and test performance. TDD methodology is covered by tdd and network mocking by msw.
Current MSW v2 guidance for request handlers, Node/browser setup, HTTP and GraphQL mocking, test isolation, timing, and debugging. General test framework patterns are covered by vitest and methodology by tdd.
Current React Hook Form v7 guidance for useForm, useWatch, useController, useFieldArray, validation, subscriptions, and UI-library integration. React Server Actions and useActionState are covered by the react skill.
Current TanStack Query v5 guidance for queries, mutations, caching, prefetching, Suspense, and render optimization. Use with useQuery, useMutation, queryClient, queryOptions, skipToken, mutation scopes, or cache invalidation. API mocking is covered by the msw skill.
System architecture guidance for Python/React full-stack projects. Use during the design phase when making architectural decisions — component boundaries, service layer design, data flow patterns, database schema planning, and technology trade-off analysis. Covers FastAPI layer architecture (Routes/Services/Repositories/Models), React component hierarchy, state management, and cross-cutting concerns (auth, errors, logging). Produces architecture documents and ADRs. Does NOT cover implementation (use python-backend-expert or react-frontend-expert) or API contract design (use api-design-patterns).