React Data Fetching: Beyond the Basics
2h 40m 15s
English
Paid
Course description
This course will teach you how to effectively load data in React without using third-party libraries or the useEffect hook. We will create our own data loading library from scratch that will handle preloading, caching, and address all common data-related challenges.
Read more about the course
What you will learn:
- How React re-renders when loading data
- Issues with using the useEffect hook for data loading
- Advantages and disadvantages of using libraries and frameworks for data loading
- How to start loading data before your React component is loaded
- How to create a data cache to prevent reloading
- How to identify and resolve issues with Network Waterfalls and Race Conditions
- When and why to use the useSyncExternalStore hook
- How to implement the stale-while-revalidate caching method
- How to perform data loading for React Server Components
Watch Online
0:00
/ #1: Course Introduction
All Course Lessons (20)
| # | Lesson Title | Duration | Access |
|---|---|---|---|
| 1 | Course Introduction Demo | 02:57 | |
| 2 | What’s Wrong With useEffect | 05:53 | |
| 3 | Using Libraries or Frameworks for Data Fetching | 05:46 | |
| 4 | Optimizing Your Dev Environment for this Course | 04:31 | |
| 5 | Fetch Data Before you Component Loads | 12:23 | |
| 6 | Creating an Efficient Data Cache | 05:39 | |
| 7 | Fetching Data on an Event | 06:43 | |
| 8 | Loading and Error Handling | 13:10 | |
| 9 | Module 2 Recap | 01:42 | |
| 10 | Simple Refetching | 09:33 | |
| 11 | Fixing Race Conditions | 20:11 | |
| 12 | Fixing Network Waterfalls | 19:06 | |
| 13 | Module 3 Recap | 02:25 | |
| 14 | The useSyncExternalStore Hook | 09:45 | |
| 15 | Prefetching Based on Page Route | 07:27 | |
| 16 | Saving Data Sources | 09:12 | |
| 17 | Stale While Revalidate | 12:47 | |
| 18 | Module 4 Recap | 03:11 | |
| 19 | Fetching on the Server | 06:07 | |
| 20 | Final Words | 01:47 |
Unlock unlimited learning
Get instant access to all 19 lessons in this course, plus thousands of other premium courses. One subscription, unlimited knowledge.
Learn more about subscriptionComments
0 commentsWant to join the conversation?
Sign in to commentSimilar courses
The Ultimate React Course 2024: React, Redux & More
Sources: udemy
In 2023, React is still the #1 skill to learn if you want to become a successful front-end developer! But it can be hard. There are so many moving parts, so ma
67 hours 14 minutes 41 seconds
Next.js & React with ChatGPT - Development Guide (2023)
Sources: udemy
Throughout the course, you will gain experience developing a Next JS application from the ground up. Additionally, you'll receive instruction on integrating Ope
7 hours 6 minutes 49 seconds
Full Stack Advanced React + GraphQL
Sources: wesbos
Just as React has transformed the way we build web applications, GraphQL is changing how we build APIs to query and mutate data. With a focus on modern JavaScript and real world...
15 hours 43 minutes 10 seconds
Web Performance Fundamentals
Sources: Nadia Makarevich
"The Fundamentals of Web Performance" focuses on the key aspects of improving the speed and responsiveness of web applications in the context of React...
Classic React
Sources: Build UI
The best course in the world to take you from zero to enterprise grade React. Stop reading out-of-date tutorials and watching crappy screen-share videos. We use a linear approac...
4 hours 10 minutes 15 seconds