How do I use useEffect in React?

How do I use useEffect in React?

The useEffect hook lets you perform side effects in function components. It runs after the render and can be used for data fetching, subscriptions, or manually changing the DOM.

Can you give me an example of how to fetch data with useEffect?

Sure! Here's a simple example:

import React, { useEffect, useState } from 'react';

function DataFetchingComponent() {
    const [data, setData] = useState([]);

    useEffect(() => {
        fetch('https://api.example.com/data')
            .then(response => response.json())
            .then(data => setData(data));
    }, []); // Empty dependency array means it runs once after the initial render

    return <div>{JSON.stringify(data)}</div>;
}

What does the dependency array do?

The dependency array tells React when to re-run the effect. If you pass an empty array, the effect runs only once after the initial render. If you include variables, the effect will re-run whenever those variables change.