From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Unlock this course with a free trial

Join today to access over 25,200 courses taught by industry experts.

Data loader: Introduction

Data loader: Introduction

From the course: Build Modern Web Apps with React, Hooks, State Management, and APIs Using Vite or Next.js

Start my 1-month free trial Buy for my team

Data loader: Introduction

“

Hello and welcome to lesson number 6 of this course. In this lesson, we are going to see how we can use route loaders and actions together. Before we start on with data loading with loader, I am going to refresh your memory and make you remember the loading work that we did once we do in the previous lessons of this course. While we were learning the useState hook, we used to define an isLoading state. The initial value was false. And while we were calling the APIs inside the useEffect, we were making the use of that loading state. We first have to set the loading to true. And once this is done, it fetches the API data. And once we have that data, we set the loading state to false. While on the JSX, if the loading is equal to true, it can show a loader or a spinner. With React router coming in, we can clean this functionality and we can have data loaders functions at route level, instead of having the logic inside the component itself. So here's the problem that we had with…

Contents