react-conventions

Structure your React SPA by adopting standardized conventions for component folders, feature organization, and pattern usage. This ensures consistency and readability across medium- and large-scale projects by specifying requirements for project layout and naming.

Apply React hooks correctly by following standardized rules for naming, dependency arrays, and usage patterns. These conventions guide teams to standardize hook implementation and avoid common misuses across complex single-page applications.

Use performance escape hatches like memo, useMemo, and useCallback only when justified by specific optimization needs. Standardized conventions help you pick these patterns appropriately to prevent unnecessary performance overhead in your React components.

Compose React components using children, render props, or compound patterns to standardize structure across your project. These conventions guide pattern choices to improve component composition and maintainability in complex applications.

Organize effects in a React single-page application by writing them only when needed and avoiding common misuses. Following standardized conventions ensures effects are applied correctly without introducing unnecessary complexity.

This React conventions skill does not cover state management or routing. It focuses exclusively on standardizing component structure, hooks usage, and patterns, directing state management, routing, forms, and testing to specialized skills.