TanStack React Query v5 - Full Guide (Setup, Mutations, Infinite Loading, Optimistic Updates)

Learn & master TanStack React Query v5 with this one video! Including useQuery, useInfiniteQuery, useMutation, optimistic updates, and more.

📣 Follow Coding in Flow on social media:

Timestamps:
0:00 - What is React Query and why should you use it?
4:05 - Starting code
6:21 - Why you shouldn't fetch in useEffect
19:15 - React Query installation & setup (queryClient, QueryClientProvider, React Query Devtools)
24:02 - Basic useQuery usage, queryKey best practices, error retries
36:24 - Search with React Query (debounced)
43:46 - Infinite loading (useInfiniteQuery)
56:19 - Custom hook
57:46 - Mutations (useMutation), invalidateQueries
1:09:27 - Updating the cache (setQueryData, InfiniteData)
1:19:35 - Optimistic updates (onMutate), error rollbacks

[kenshinhimura]

You explain very well when zustand and when react query

[BahaaAldein]

We love your tutorials❤❤❤❤ they are fantastic and I learn a lot from them🌟🌟🌟🌟

[thieuson]

I've learn alot from your tutor, big thanks

[abdushakoor]

started from how to go to new activity with Intent and now we are here

[levato]

Really big fan of your work, the best tutorials out there. I know you probably get a lot of requests but if you could teach how to use optimistic updates with framer motion animations? I could not find an example anywhere, and I keep getting duplicate animations.

[starlord]

Fatastic tutorial, learnt great deal of info about react query. Only 1 request, please upgrade the videos resolution to 2k if possible

[kasunakalanka]

thank you very much. always enjoy your tutorials❤

[K.Kuture]

great vid. you dont really need to instantiate query client inside a react component. you can put it outside of it. otherthan that, it is really a great video

[SogMosee]

I want to see prefetching, deduplication, and to really test you rq and your typescript skills, a custom hook that wraps rq and augments it in some way, like automatically returning a query client or the toast function to be available for use in the callbacks without needing to do imports in each file.

[JeanBaptisteChabi]

Fuck it man, you have no idea how ive been longing for this, im currently building 3 frontend mobile app for a multivendor platform and i real real realy meeded this, absolutely amazing, im really really happy right now

[sssrikanthhh]

Thanks bro❤, you provided the tutorial very fast

[sumitgondaliya]

Need a Tanstack router tutorial as well

[johnday]

I would love a video with your thoughts on when to use server side fetching instead of TanStack React Query.

[learnearn]

Really a great learning, Thanks for awesome content and explaination.

[BadHunterN]

Legend ❤
I have only one comment I want dark mode for the demo

[sinamalakzadeh]

thx for your effort <3
plz do plz do authjs via cerdential (make it customizable for ex otp and etc ..)

[acloudonthebluestsky]

will you have the testing part with the tanStack Query boss?

[abdelrahmanmagdy]

could you please make a tutorial about tRPC ?

[regilearn]

This is great, can you do a video on how to use Zustand course with Typescript for zero to hero

[ismogivenchy]

Hi Florian,

I have been using your express/nextmjs tutorial as a template for my event management app I'm creating.
You use SWR instead of react query because SWR is a lighter version of react query, correct?