# Frontend React > Builds React 18+ and TypeScript UI for this project—components, Material-UI, Zustand, React Query, and REST API integration. Use when creating or changing pages, components, forms, or frontend tests. - Skill: `tomevault-io/frontend-react-3` (Agent Skill, multi-file: 2 files) - Install (CLI): `npx skillmds@latest add tomevault-io/frontend-react-3` - Raw SKILL.md: https://api.skillmd.com/api/skills/tomevault-io/frontend-react-3/raw - Safety review: pending - Works with: Claude Code, Claude.ai, OpenAI Codex - Category: Web & Frontend - Author: tomevault-io (https://skillmd.com/u/tomevault-io) - Updated: 2026-09-17 - Page: https://skillmd.com/skills/tomevault-io/frontend-react-3 --- # Frontend React Skill ## When to use - Creating or changing pages, components, or forms (React, TypeScript, MUI) - Integrating with the REST API (see project context for API base URL), auth, or state (Zustand, React Query) - Writing or adjusting frontend tests (Vitest, React Testing Library) - Verifying build (`npm run build`) or fixing TypeScript/unused-import issues For **testing** focus (TDD, mocks, coverage), use the `testing` skill and `.cursor/rules/frontend-testing-practices.mdc`. ## References | File | Purpose | |------|---------| | [.cursor/rules/frontend-patterns.mdc](.cursor/rules/frontend-patterns.mdc) | TypeScript (no `any`, braces, unused imports), state (Zustand, React Query, local), API and auth, MUI, forms (RHF+Zod), routing, loading/error, performance, pre-commit checklist, file layout | | [docs/frontend/](docs/frontend/) | Architecture, API integration, UI/UX | --- > Converted and distributed by [TomeVault](https://tomevault.io/claim/pedromsmoreira) — claim your Tome and manage your conversions.