What are some examples of custom hooks in React?

What are some examples of custom hooks in React?

Custom hooks in React are functions that allow you to reuse stateful logic. For example, a useFetch hook can be created to handle API calls.

Can you show me how to create a useFetch custom hook?

Sure! Here's a simple example:

import { useState, useEffect } from 'react';

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

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

    return { data, loading };
};

This hook fetches data from a given URL and returns the data and loading state.

What other custom hooks can I create?

You can create various custom hooks like useLocalStorage for managing local storage, useDebounce for debouncing input, or useWindowSize for tracking window dimensions.