How do I create a custom hook in React?

How do I create a custom hook in React?

Creating a custom hook in React involves defining a function that uses built-in hooks. What functionality do you want to implement?

I want to create a hook for fetching data from an API.

You can create a custom hook called useFetch. It would use useState and useEffect to manage the fetching process. Would you like a code example?

Yes, please provide a code example.

Here's a simple example:

import { useState, useEffect } from 'react';

const useFetch = (url) => {
    const [data, setData] = useState(null);
    const [loading, setLoading] = useState(true);
    const [error, setError] = useState(null);

    useEffect(() => {
        const fetchData = async () => {
            try {
                const response = await fetch(url);
                const result = await response.json();
                setData(result);
            } catch (err) {
                setError(err);
            } finally {
                setLoading(false);
            }
        };
        fetchData();
    }, [url]);

    return { data, loading, error };
};

You can use this hook in your components to fetch data!