Course image for React Query - The standard way to make network requests in React

React Query - The standard way to make network requests in React

Move beyond fetch and useEffect to make requests in React. Get caching advantages and more with react-query

2 hours+ of total content
4.7
16 ratings
308 developers learning
Course Creator: Mehul Mohan

Hang on...

Goals

  • What is React Query and why we need it
  • Internals of react-query v3
  • Debugging queries and mutations using devtools
  • How caching works in react-query
  • Sharing data across multiple components without making multiple requests

Description

Get performant and powerful data synchronization for React using react-query. React query is a library built for react and Next.js codebases that comes baked in with all the best practices you should follow while making network requests:

  • Caching
  • Devtools
  • Automatic data invaldation
  • Stale while revalidate
  • And much more

No more hacking around with fetch and useEffect all day long. React query provides a standard way of performing API requests in your app. Moreover, with react-query, it is possible that you can get rid of your central state management like Redux or Context API because react query can cache and make your data available across multiple components automatically. It is a production-level ready library and the benefits are endless.

In this course, let’s take a deep dive into what react query is, how it works and why exactly you’ll need it. This course is interactive with tons of labs and projects to complete as you go and is available by default under codedamn Pro membership. If you are ready to upskill your React skills as a production-level developer, let’s start.

Course Structure

24 lectures 02:08:18 total duration

Introduction to React Query

(5 lectures • 20 minutes)
  Course Introduction (Preview)
01:46
  Why React Query? (Preview)
03:37
  Installing React Query (Preview)
02:32
  Hello world with react-query (Preview)
07:52
  Install react-query (Practice lab)
05:00
  React query states (Preview)
06:27
  React query devtools explained (Preview)
03:51
  Query keys (Preview)
04:20
  Dependent queries (Preview)
04:57
  Small GitHub app with react-query (Preview)
09:12
  Creating a mini blog with React query (Preview)
11:38
  Recreate the mini blog (Practice lab)
05:00
  getQueryData (Preview)
06:36
  cacheTime (Preview)
02:28
  Transform query result (Preview)
02:40
  setQueryData (Preview)
06:47
  staleTime (Preview)
06:18
  Play with cacheTime and staleTime (Practice lab)
05:00
  Default query options (Preview)
02:50
  Mutations (Preview)
07:18
  Mutation side effects (hook) (Preview)
04:03
  Mutation side effects (mutate fn) (Preview)
04:42
  Building a To Do app with queries + mutations (Preview)
10:02
  Building a To Do app - part 2 (Preview)
03:22

Last 5 Reviews

AR
Anagha R
Jun 16, 2021
Very Nicely explained the concept, along with use cases. Thank You
HA
Hassnain Abbas
Jun 15, 2021
it is 👌
AP
Ashutosh Panda
Jun 14, 2021
Dealing with react query for the first time. Very nice explanation
RW
Ruchika Wadkar
Jun 12, 2021
Best course on React Query till now
CS
Chirag Saini
Jun 12, 2021
Really Nice Explanation

Your Instructor

Mehul Mohan

Full-stack developer and security researcher

I'm a full-stack developer working with JavaScript and its associated runtimes for the past 7 years. I love to play with code and make something useful out of it! You can find me on social media, I'm quite active there :)
codedamn logo

We ♥ quality. And we would love to see your growth. Hence, codedamn comes with a pro plan for advanced and accelerated learning!

Free

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • Support over WhatsApp
  • Learning Path support
  • Unlimited hands-on practice

Pro

  • HD video content
  • Certificate of completion
  • Mentorship from codedamn staff
  • Support over WhatsApp
  • Learning Path support
  • Unlimited hands-on practice
Become Pro Member