React Patterns

---
version: 4.1.0-fractal
name: react-patterns
description: Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.
allowed-tools: Read, Write, Edit, Glob, Grep
---

# React Patterns

> Principles for building production-ready React applications.

---

## 1. Component Design Principles

## 🧠 Knowledge Modules (Fractal Skills)

### 1. [Component Types](./sub-skills/component-types.md)
### 2. [Design Rules](./sub-skills/design-rules.md)
### 3. [When to Extract Hooks](./sub-skills/when-to-extract-hooks.md)
### 4. [Hook Rules](./sub-skills/hook-rules.md)
### 5. [State Placement](./sub-skills/state-placement.md)
### 6. [New Hooks](./sub-skills/new-hooks.md)
### 7. [Compiler Benefits](./sub-skills/compiler-benefits.md)
### 8. [Compound Components](./sub-skills/compound-components.md)
### 9. [Render Props vs Hooks](./sub-skills/render-props-vs-hooks.md)
### 10. [When to Optimize](./sub-skills/when-to-optimize.md)
### 11. [Optimization Order](./sub-skills/optimization-order.md)
### 12. [Error Boundary Usage](./sub-skills/error-boundary-usage.md)
### 13. [Error Recovery](./sub-skills/error-recovery.md)
### 14. [Props Typing](./sub-skills/props-typing.md)
### 15. [Common Types](./sub-skills/common-types.md)
### 16. [Test Priorities](./sub-skills/test-priorities.md)