# React Frontend Best Practices

> Provides domain-specific best practices for building React Single Page Applications with TypeScript.

Provides domain-specific best practices for building React Single Page Applications with TypeScript. Use when developing, structuring, or reviewing a React SPA — including feature-based architecture, component and hook placement, TypeScript type safety, functional component patterns, performance optimisation (useCallback/useMemo/stable handlers), CSS Modules styling, routing with centralised route constants, data fetching with TanStack React Query, internationalization (i18n), accessibility (a11y/ARIA), environment variable validation, and unit testing with Vitest + React Testing Library. Also covers the pre-commit quality gate (lint, typecheck, test, coverage, snapshots) and Conventional Commits. Trigger terms: React SPA, React component, custom hook, CSS Modules, React Query, react-i18next, Vitest, React Testing Library, feature folder, route constants, component placement.

- Page: https://ss33.ai/skills/ilteoood/react-frontend-best-practices-48660982807
- Publisher: ilteoood
- Category: [Software Development](https://ss33.ai/skills/category/software-development-t44z8z) › [Frontend & UI](https://ss33.ai/skills/category/software-development-t44z8z/frontend-and-ui-q25e9r)
- Source: https://github.com/ilteoood/harness/blob/a7378c50b3bd34ab82fdfd3214d70670be2666b9/skills/web-development/react-frontend-development/SKILL.md

## Skill

This skill's licence does not allow redistribution, so the store does not serve its text. Get it from the author: https://github.com/ilteoood/harness/blob/a7378c50b3bd34ab82fdfd3214d70670be2666b9/skills/web-development/react-frontend-development/SKILL.md