React Hooks are special functions that let you use state and other React features without writing a class. They simplify code and enhance functionality.
The most commonly used hooks are:
- useState The useState Hook lets you add state to functional components. It returns an array with two elements: the current state and a function to update it.
const [count, setCount] = useState(0);
- useEffect The useEffect Hook allows you to perform side effects in your components, such as data fetching, subscriptions, or manually changing the DOM. By default, it runs after every render, but you can control when it runs by specifying dependencies.
useEffect(() => {
document.title = useEffect Hook;
}, [count]);
- useContext The useContext Hook allows you to access the value of a context directly in your functional components. This is useful for accessing global data like themes, user settings, or authentication status without passing props down manually.
const theme = useContext(ThemeContext);