React
Cap nhat 8 thg 2, 2026React Component Patterns Cheat Sheet
A quick reference for common React component patterns: compound components, render props, HOCs, and custom hooks.
Compound Components
Parent manages shared state, children consume it via context. Great for flexible component APIs like Tabs, Accordion, Select.
Render Props
A function prop that returns JSX. Useful for sharing behavior without imposing structure. Being replaced by hooks in most cases.
Higher-Order Components (HOCs)
A function that takes a component and returns an enhanced component. Common for cross-cutting concerns like auth guards. Use sparingly in modern React.
Custom Hooks
The modern way to share stateful logic. Extract `useState` + `useEffect` combos into reusable hooks. Composable and testable.