React Query

https://fullchee-reminders.netlify.app/link/2090

Handle caching, retrying and a bunch of this logic

instead of doing it yourself with useEffect

has dev-tools

No need to use an abort controller!

useFetch.jsx

export function useFetch(url) {
    const [loading, setLoading] = useState(true)
    const [data, setData] = useState()
    const [error, setError] = useState()

    useEffect(() => {
+       const controller = new AbortController()
        setLoading(true)
-       fetch(url)
+       fetch(url, { signal: controller.signal })
            .then(setData)
            .catch(setError)
            .finally(() => setLoading(false))
+       return () => {
+           controller.abort()
+       }
+   }, [url])
    return { loading, data, error }
}

---

Last update: 2023-02-03