U
React Guide

Example 2 · 30–35 min

Custom useFetch Hook

Cache · Abort · Error

Senior Level

The Question

"Build a reusable useFetch hook that manages loading / data / error state with useReducer, cancels in-flight requests when the URL changes or the component unmounts, and caches results so repeated calls for the same URL are instant."

useReducerAbortControllerrace conditionsunmount safetyrequest cacheuseEffect cleanup
GET https://jsonplaceholder.typicode.com/users