Data and Errors

3 lessonsAbout 18 minutesAdvanced

This part of the React Tutorial runs from Fetching Data through to forwardRef, Portals and Lazy Loading. There are 3 lessons here, and working through them takes about 18 minutes at a steady pace.

It follows on from Effects and Refs, so finish that first if you have not already — the examples below assume you are comfortable with it.

Each lesson below says what it covers before you open it. Read them in order the first time; afterwards this page works as a index you can jump back into when you need to check one thing.

1Fetching DataFetch data in a React effect: loading and error states, cancelling stale requests with AbortController, and why a library eventually replaces this.
2Error BoundariesAn error thrown while rendering unmounts your whole React app. Learn what an error boundary catches, what it cannot catch, and where to put one.
3forwardRef, Portals and Lazy LoadingPass a ref into your own component with forwardRef, render outside the parent with createPortal, and split code with React.lazy and Suspense.

All of React Tutorial Next: Context