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
MERN Stack Front To Back: Full Stack React, Redux & Node.js.
Sources: udemy, Brad Traversy
Welcome to "MERN Stack Front To Back". In this course we will build an in depth full stack social network application using Node.js, Express, React, Redux and MongoDB along with...
11 hours 52 minutes 29 seconds
React Query (OLD)
Sources: ui.dev (ex. Tyler McGinnis)
Learn React Query with the official React Query course. WANT TO SKIP THE DOCS? There’s an easier way to master React Query. Our linear course is like having...
7 hours 1 minute 30 seconds
Build a Shopping Cart App
Sources: Reed Barger
Gain expert skills to build and deploy an amazing React app. An epic training course that gives you the entire process to build and deploy your own top-tier e-c
1 hour 41 minutes 52 seconds
Building Large Scale Web Apps | A React Field Guide
Sources: Addy Osmani, Hassan Djirdeh
CODE SMART, SCALE FAST, CONQUER CHALLENGES. Learn tools and techniques to build and maintain large-scale React web applications. “Building Large Scale Web Apps” is a toolkit to ...
Composing Layouts in React
Sources: fullstack.io
In this course we show you how to build complex layouts in React by composing just a few foundational layout primitives. Along the way you will learn modern CSS Layout tools lik...
4 hours 38 minutes 12 seconds