YoVDO

Pagination in React Tutorial with React Query and Hooks Examples

Offered By: Dave Gray via YouTube

Tags

React Query Courses Web Development Courses React Courses Axios Courses

Course Description

Overview

Learn how to implement pagination in React with this comprehensive tutorial. Explore two full examples using React hooks and React Query to display pages of query data, create numbered buttons, and implement navigation functions for next, previous, first, and last pages. Dive into practical implementations using Axios for API calls and discover how to leverage React Query's features like useQuery, isPreviousData, and keepPreviousData. Follow along as the instructor guides you through creating reusable components, handling API data, and testing functionality. By the end of this tutorial, gain the skills to efficiently manage and display large datasets in your React applications.

Syllabus

Intro
Welcome
Installing dependencies
Tutorial Pace
Begin Example #1: Axios
React hooks only, Basic API
Post component
useEffect
Complete Example1 component
Check Example #1 functionality
Begin Example #2
User component
More useful API data
Axios instance #2
Example #2 imports
React Query: useQuery
React Query: isPreviousData and keepPreviousData
More Example2 component
PageButton component
Example2 JSX
Example #2 functionality
Change next & previous to first & last
Test the new functions


Taught by

Dave Gray

Related Courses

Software as a Service
University of California, Berkeley via Coursera
Intro to Computer Science
University of Virginia via Udacity
Web Development
Udacity
Software Engineering for SaaS
University of California, Berkeley via Coursera
CS50's Introduction to Computer Science
Harvard University via edX