useState Hook
The useState Hook lets you add state to function components.
const [count, setCount] = useState(0);
return (
<button onClick={() => setCount(count + 1)}>
Count: {count}
</button>
);useEffect Hook
The useEffect Hook lets you perform side effects in function components.
useEffect(() => {
document.title = `Count: ${count}`;
}, [count]);useContext Hook
The useContext Hook lets you subscribe to React context without nesting.
const theme = useContext(ThemeContext);Custom Hooks
Custom Hooks let you extract component logic into reusable functions.
function useCounter(initialValue = 0) {
const [count, setCount] = useState(initialValue);
const increment = () => setCount(count + 1);
const decrement = () => setCount(count - 1);
return { count, increment, decrement };
}