react
Installation
SKILL.md
react
Patterns for React 19 + TypeScript + Vite apps. Strict tsconfig, feature-sliced src/, TanStack Query over a typed openapi-fetch client, Zod-validated forms, Zustand for UI state, shadcn/ui + Tailwind v4, and React Three Fiber + Drei for 3D scenes.
When to load recipes
| You are working on… | Load recipe |
|---|---|
| New React + Vite project setup | references/recipes/project-config.md |
| Feature folder structure | references/recipes/folder-structure.md |
| Zustand store | references/recipes/zustand.md |
| shadcn/ui components or Tailwind CSS | references/recipes/shadcn-tailwind.md |
| React Three Fiber / Drei 3D scene | references/recipes/drei-threejs.md |
| Data fetching, forms, Zod validation | references/recipes/data-fetching.md |
Load project-config.md + folder-structure.md for any new React project. The shadcn/Tailwind, Drei, and data-fetching recipes assume the project-config baseline (strict tsconfig, ~/* alias, ESLint flat config) is already in place.