How React Query Won

  Рет қаралды 87,828

Theo - t3․gg

Theo - t3․gg

Күн бұрын

Пікірлер: 199
@uidotdev
@uidotdev 6 ай бұрын
We love you too! Thank you for the kind words. ❤
@markdesign1354
@markdesign1354 6 ай бұрын
I love Both of you !! 🩷
@sentinelav
@sentinelav 6 ай бұрын
Wow, uidotdev has some great design intuition and information presentation. Definitely going to give them a sub.
@ccccjjjjeeee
@ccccjjjjeeee 6 ай бұрын
description is 💯. tanstack query is the only thing that has fundamentally changed how i build frontend stuff in the last years. i'd rather use any other framework with tanstack query, than react without it.
@radiantveggies9348
@radiantveggies9348 6 ай бұрын
I prefer RTK query
@deshi-sukuna
@deshi-sukuna 6 ай бұрын
@@radiantveggies9348 that only if u use redux toolkit, and I doubt most apps need a global state management library these days, server state is the way to go, but if you still need it using react query as a caching system alongside as a query provider is a no-brainer
@sampiiiiiiiiii
@sampiiiiiiiiii 6 ай бұрын
Holy shit I had no idea you could use react query outside of just data fetching, this is gonna change so much for me at work, thanks king
@Tanner-cz4bd
@Tanner-cz4bd 6 ай бұрын
Timestamp ?
@ClariNerd
@ClariNerd 6 ай бұрын
1:48 the magic of Python is the community is so vibrant that you don’t mind it takes forever for the code to run, because you end up keeping such good company
@Cangussu97
@Cangussu97 6 ай бұрын
Phenomenal timing, my team is implementing a kanban-like board and struggling with state having everything in react-query. Going to integrate zustand for the complex board state, and react query for handling the async logic
@odra873
@odra873 6 ай бұрын
Or just use redux with rtk query and have it flawlessly integrated instead of connecting zustand with react query?
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
​@@odra873Hell na fam... It's 2024, say no to reducer overheads
@aeronwolfe7072
@aeronwolfe7072 6 ай бұрын
those tkdodo blogs are ESSENTIAL. read them if you wanna learn react query. amazing information there.
@shapelessed
@shapelessed 6 ай бұрын
8:00 - This is the exact reason I ran screaming to backend once I got to learning React. The way React handles all its hooks, and the way they all tangle around each other and mess things up once you start using more than just one or two of them, is the single reason why I'll be staying far away from frontend, despite actually preferring working with UIs.
@Holobrine
@Holobrine 6 ай бұрын
Signal-based reactivity is much easier to think around, I hope you consider trying out Svelte 5 when it comes out
@Leeway4434
@Leeway4434 6 ай бұрын
have you tried htmx?
@MSheepdog
@MSheepdog 6 ай бұрын
I'm primarily a Vue dev, but still recommend bringing in TanStack Query if you're building something with complex caching needs. The basic tools provided by Vue (and Pinia) handle async data a lot better than what you get in React, but after a certain point you'll end up needing to pull in something like TanStack Query or else you'll just be rebuilding the same functionality.
@IkeVictor
@IkeVictor 6 ай бұрын
great explanation for react query. very concise and to the point at the end there. great stuff!
@helleye311
@helleye311 6 ай бұрын
9:40 I'm proud to say I've written this code for a production app once, and immediately started pushing for react query. Which took me a while as a junior, but eventually I figured everything out and when I left every fetch was running through react query.
@aeronwolfe7072
@aeronwolfe7072 6 ай бұрын
i LOVE React-Query. Before I even learned React, I did ALOT of research, so I've never written that bad data fetching code, but since I've learned React-Query, I have used it in EVERY SINGLE PROJECT i've written. lol. it just solves such a KEY problem... thanks for making great content theo and for making me smile! :)
@ShootingUtah
@ShootingUtah 6 ай бұрын
Switching to React Query in our project at work was great! I was able to get rid of some really complicated useEffects and other crap by using a couple of custom hooks using useQuery inside. It's great for keeping things updated in tables and forms and searching and filtering data, just adding things to the query key and everything is just handled.
@jakeoverflow
@jakeoverflow 6 ай бұрын
"It's been very hard for me to not watch this one" He said with the red watch progress bar at 100% 😂
@peteremad5228
@peteremad5228 6 ай бұрын
why theo didn't mention at all ..that it is framework agnostic ?
@pointer333
@pointer333 Ай бұрын
Great video. Value perceived. Wisdom gained. Thank you.
@NilsWestgardh
@NilsWestgardh 6 ай бұрын
I'm a self-taught dev who started with HTML/CSS a year ago, and started learning React/Next.js in December 2023. I'm half-way through the video and I'm guilty of doing all these things. Good learning opportunity!
@rns10
@rns10 3 ай бұрын
Quick ques- can we directly dive in using react query. Or should we first learn to build it in react to understand the fundamentals?
@zaccanoy
@zaccanoy 2 ай бұрын
i think the answer to this depends on what your goals are. generally, i think it’s best to understand why any library is useful before you use it. if your goal is to learn, i feel like that’s the best course of action. if your goal is to make an app as quickly as possible, you’re probably going to end up using tanstack query anyway, so i’d recommend just doing that. but building your own useQuery and understanding why QueryProvider is useful makes everything much clearer in the long term
@tom.watkins
@tom.watkins 6 ай бұрын
Ashamed to admit I've written every bad thing in this video. In a weird way I'm kinda glad I have, there is a value in learning how to do things with primitives, even if it sucks. Gives you a better understanding of the framework and an true appreciation of the abstraction when it comes along and an understanding of why you need it
@jgkdmdevienjjgg8866
@jgkdmdevienjjgg8866 6 ай бұрын
7:35 there's also AbortController/AbortSignal for cancelling fetch-es (and axios) which i believe was stolen from C#'s CancellationTokenSource/CancellationToken async tasks concept
@zelli840
@zelli840 4 ай бұрын
Interesting phenomenon going on where when i have problem I can't figure out. I get recommended a Theo video with the solution to that exact problem.
@ronaldos3738
@ronaldos3738 Ай бұрын
I would like to know what tool he uses for creating the animations
@ignrey
@ignrey 6 ай бұрын
Thanks for the explanation of hooks behavior, I've seen plenty of times people showcase that same code without any explanation. It's such a weird thing.
@rikschaaf
@rikschaaf 6 ай бұрын
33:34 "If you think you can do something better", well in that case, just go make a new react-query library
@Pyraptor
@Pyraptor 6 ай бұрын
You use mutation example is wrong though, why are you invalidating inside the mutation function?
@ThomasWSmith-wm5xn
@ThomasWSmith-wm5xn 6 ай бұрын
in the middle of moving an older code base to using react query - absolute nightmare. either start with react quey or forget about it. and if you're caching a heavily networked app - save yourself the time and just re-write the whole app
@lamhung4899
@lamhung4899 6 ай бұрын
Starting with redux and happy enough with RTK Query. thanks redux team 😂
@vetrivendhan6122
@vetrivendhan6122 6 ай бұрын
Still in the interview some devs ask questions about promises and nested promises. But I stopped using that after I started using the React query.
@sandeepmb
@sandeepmb 5 ай бұрын
that autocomplete is cool. what is it?
@thelostrider1
@thelostrider1 6 ай бұрын
In the example from the docs at 8:00, why is the state being set to null before the api call and why isn't the the api call inside the "if ignore"? Why make an api call to ignore the result after?
@Fupicat
@Fupicat 6 ай бұрын
The cleanup function is called when the effect reruns. At the time the first request was made, the code reasonably assumes the value it fetched is going to get used. But, for example, if the user clicks a different bio to load in the UI, while another one was already being fetched, you can't stop that fetch midway through, so you have to discard the value once it returns, so that the UI doesn't show incorrect data if a previous fetch is finished after the most recent one. Fetch operations are asynchronous, so you can have multiple running at the same time and can't know which one is going to return first.
@akifahmed9610
@akifahmed9610 6 ай бұрын
Which os are you using? And is it a github copilot or something else?
@patrickaikonia853
@patrickaikonia853 6 ай бұрын
I don't know if I am doing something wrong but when I write applications with little state management and state sharing, I tent to use the data layer api in react router.
@henriquematias1986
@henriquematias1986 6 ай бұрын
why do you do async function and return await if it could be just a regular function with a regular return? : D
@Aleks-fp1kq
@Aleks-fp1kq 6 ай бұрын
Seems we don't beef react-query with next.js?
@tomatoslav
@tomatoslav 6 ай бұрын
it makes writing apps easier and it looks cleaner ... I think the same could've been accomplished by writing a custom hook that does the exact same thing, but i guess writing it always seemed like more work than just sticking with the "old way"
@sudsy3
@sudsy3 5 ай бұрын
what browser u usin
@bobwilkinsonguitar6142
@bobwilkinsonguitar6142 6 ай бұрын
Lmfao at 5:47 "You've probably seen this before" My brother in christ ive written this exact app. My buttons came from MUI though😂
@wisdomelue
@wisdomelue 6 ай бұрын
my favorite react library
@moggedau
@moggedau 6 ай бұрын
useSWR also really good. Create a service file and export your fetch calls with from it for reusable calls. Syntax a bit cleaner on swr but this looks solid too
@favanzzo
@favanzzo 6 ай бұрын
New here theo. What vscode theme do you use?
@balaclava351
@balaclava351 6 ай бұрын
What's with the hate for Redux (genuinely curious)?. I use RTK in production. When I have large arrays of data it makes it easy to update one single object when a websocket signal comes in that the data has changed and the selectors make it easy to select specific data from the store.
@neociber24
@neociber24 6 ай бұрын
I think people don't like it because it introduces a lot of code for solving a problem in comparison with React query.
@jgkdmdevienjjgg8866
@jgkdmdevienjjgg8866 6 ай бұрын
I think it's not react's flaw. It's because react is not a framework and it's only job is to render ui. All other stuff that every app needs has to be used from libs or written for every project as core/basic/framework code
@Maleficarios
@Maleficarios 6 ай бұрын
Why the hate on Redux, it suffers from NONE of these issues + its not even the same issue resolver. Sure its a lot of boilerplate, but boilerplate is abstract-able. Also, video is wrong in pointing out that using context updates not only the subscribed components but the entire app... which is what happens really.
@everythingisfine9988
@everythingisfine9988 6 ай бұрын
Redux requires a lot of boilerplate for a fraction of the amount of features RQ has. Simple things like handling race conditions, isLoading, isFetching, isStale (if state data is old), etc. The Data type names are the rest apis. Every time u call an api, u automatically get the save data from state - if u wish. It's just wildly simple and efficient
@combatninjaturtle
@combatninjaturtle 6 ай бұрын
@@everythingisfine9988Redux is also a sync state manager…. It is more of a complete state management solution. Also it’s opinionated, that means every dev will stick to same pattern.
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
The boilerplate is hardly justified when you have simpler to reason about solutions available
@UmairSadaqat
@UmairSadaqat 5 ай бұрын
Tk blog is amazing
@silentsleeper
@silentsleeper 6 ай бұрын
how does react query match against swr?
@seiuwatches
@seiuwatches 6 ай бұрын
You said "it's been very hard not to watch this one," but your watch history shows you viewed the entire video. It's a bit weird that you mentioned the same points the author makes just minutes before, and then emphasize that these are the same things you said. I'm not saying you of trying to seem more knowledgeable to the viewers, but it feels a bit misleading.
@busybox4984
@busybox4984 6 ай бұрын
He probably just clicked on it once for some reason but left the page without watching the video. Sometimes when I open some videos I'll watch later using middle click to open in a new tab, it registers the video as fully watched, even though I did not even open it. Yes it feels misleading in this case but Theo probably didn't lie here.
@AvanaVana
@AvanaVana 6 ай бұрын
He did this video on his livestream first. That’s why it was watched. Then he cut the portion about this video and repackaged it as an on-demand video here on YT.
@jackdixon6681
@jackdixon6681 6 ай бұрын
as @busybox4984 said, opening a video for a second will make it look like you've watched the whole thing.
@habong17359
@habong17359 6 ай бұрын
Who cares man. He sharing knowledge that you wouldn't have learned otherwise. Just chill and move on.
@Bchvji647
@Bchvji647 6 ай бұрын
YT watch history is NOT accurate whatsoever. Go check yours and see for yourself.
@TheRiddl37
@TheRiddl37 6 ай бұрын
Next JS 14 user here, do we really need it still though, having RSC's and what not?
@TkDodo
@TkDodo 6 ай бұрын
I have a blogpost about this titled: You Might Not Need React Query. Give it a read :)
@philheathslegalteam
@philheathslegalteam 6 ай бұрын
Yessnnt’
@TheRiddl37
@TheRiddl37 6 ай бұрын
@@TkDodo Thanks!
@trontrontrontron4
@trontrontrontron4 6 ай бұрын
i love react query, therefore i have to love this video now.
@QuantenMagier
@QuantenMagier 6 ай бұрын
So React is just an incomplete library to implement AJAX and React Query is the missing module to make AJAX work without hick-ups?!
@morosis82
@morosis82 6 ай бұрын
No, React is the presentation side of the equation and left the server side up to you. React Query still leaves the server side up to you, but provides the glue to get them to work in harmony easily.
@TkDodo
@TkDodo 6 ай бұрын
@@morosis82that's very well put 👏
@iercan1234
@iercan1234 6 ай бұрын
is "useSWR" the react-query of next.js?
@TkDodo
@TkDodo 6 ай бұрын
It solves a similar problem in slightly different ways and with different tradeoffs. They both work great together with next.js
@happykill123
@happykill123 6 ай бұрын
Will put in prod first thing Monday morning.
@iury664
@iury664 6 ай бұрын
what axios has to do with react-query ?
@faucar93
@faucar93 6 ай бұрын
to be honest I would rather use react with all hooks and stuff like that , react query is nice but still people forget that you could have a singletone class and use it as a state...... plus a bunch of good stuff from js..... anyways. who else wants to have the world in flames ?
@atic64
@atic64 6 ай бұрын
I have a problem when use React Query to manage user token, anyone have a example for me for how to share token in admin pages and redirect to login page when user is unauthorized.
@kazmi401
@kazmi401 6 ай бұрын
if you are using react-router then you might use a Higher-order-component put your logic of protecting routes and redirecting there and grab all the protected/admin routes/pages inside that HOC.
@MasterChef613
@MasterChef613 6 ай бұрын
My team handled this at the promise level. I made a fetch wrapper that handles all the auth stuff before making the call, and returns an error if the token is missing or is expired. All the logic you're referencing can be handled in a similar way. This is not the problem RQ was designed to solve, but thankfully it's reliance on promises help RQ get out of the way
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
​@@MasterChef613That's the way🍵
@OnkarMahamuni13
@OnkarMahamuni13 2 ай бұрын
Life as a react developer was hell before react query, I must say!!
@NR1612
@NR1612 6 ай бұрын
When I first looked into React, I already hated the data fetching model and switched to react query on my first project. I have never looked back.
@dominionebenezer4452
@dominionebenezer4452 5 ай бұрын
bro whats wrong with tanstackQuery Unhandled Runtime Error Error: (0 , _tanstack_react_query__WEBPACK_IMPORTED_MODULE_5__.useQuery) is not a function
@jacobslunga4216
@jacobslunga4216 6 ай бұрын
Theo, what font do you use in vscode?
@GratuityMedia
@GratuityMedia 6 ай бұрын
Likely Geist Mono font
@jacobslunga4216
@jacobslunga4216 6 ай бұрын
@@GratuityMedia Thx1
@lucasmarin4040
@lucasmarin4040 6 ай бұрын
Don't other frameworks have this problem?
@CottidaeSEA
@CottidaeSEA 6 ай бұрын
The one thing I don't like about this library is how you prevent an initial fetch. I can live with that though.
@tsonga-absolutest
@tsonga-absolutest 6 ай бұрын
we got Theo reacting to web dev history video before gta 6
@starnumber_alt
@starnumber_alt 6 ай бұрын
When react query on t3?
@TkDodo
@TkDodo 6 ай бұрын
create-t3-app uses tRPC, and tRPC uses react-query as their react layer. So if you're using the t3 stack, you're also using react-query :)
@AlexanderBorshak
@AlexanderBorshak 6 ай бұрын
"Won" - _past_ participle of "win" (from dict). Package loads from NPM (weekly): - Axios - 50M - React - 24M - tanstack/react-query - 3,5M - apollo/client - 3,2M React Query Won?
@DiogoTeixeira-h8r
@DiogoTeixeira-h8r 6 ай бұрын
Why are you comparing it with Axios? These two are tools for different needs.
@AlexanderBorshak
@AlexanderBorshak 6 ай бұрын
@@DiogoTeixeira-h8r The video's author included it in the list on the video's splash screen, so i've included it in the list.
@coachnoobgaming1262
@coachnoobgaming1262 6 ай бұрын
Is it the same with tRPC?
@everythingisfine9988
@everythingisfine9988 6 ай бұрын
No, tRPC will be for the request itself. But I think tRPC with React-Query would be a killer combo
@TkDodo
@TkDodo 6 ай бұрын
@@everythingisfine9988 seems like it isn't known that tRPC is built on top of React Query when used with React :)
@Theepicfrenchguy
@Theepicfrenchguy 6 ай бұрын
I was using "SWR" and never knew about "react-query". Time to switch 👀.
@StephanHoyer
@StephanHoyer Ай бұрын
I just learned how much more shitty than thought react is. Holy moly. Prop diffing to prevent diffing vdom 🤯 But react-query is very nice. Nice intro.
@SogMosee
@SogMosee Күн бұрын
react query has ugly variable names and too many variables for the concept of loading (isLoading, isPending, isFetching, isRefetching, isInitialLoading, etc.) Also not easy to access the state of an ongoing query in another part of the application. Also they got rid of onSuccess, onError, and onSettled which was a massive L, so I just rolled my own wrapper hook around rq that uses useeffect for the data and errors to then call my onSuccess and error handlers so I can continue to have that lovely api. Wrapping rq also allows me to initialize the query client in my hook pass it in my onSuccess so I can invalidate queries right there from my function props like const someFeatureApi = useQuery(url, { onSuccess: (props) => { console.log(props.data) props.queryClient.invalidateQueries(props.keys.someUrlKey) } ) if (someFeatureApi.isLoading) return null ....
@evergreen-
@evergreen- 6 ай бұрын
I tried React Query but quickly found out that it creates more problems that it solves. E.g. a big no-no for me was that it makes components that use it completely untestable due to its global state. I ended up creating a simple custom hook that mimicked basic useQuery API in like 500 loc and it worked just fine
@TkDodo
@TkDodo 6 ай бұрын
Not untestable at all. You can mock the network layer with tools like msw, or you can seed the queryCache before your test with setQueryData. The external data is a dependency to your component, so saying it's untestable means any component that has useContext in it is untestable. I have a blog post on testing and also cover this in the course.
@evergreen-
@evergreen- 6 ай бұрын
@@TkDodo what you just wrote doesn't meet my criteria for "testable" code. 1. Seeding queryClient is a bad solution because your test is now dependent on an external implementation of the queryClient. Since the queryClient has its own state AND state transition logic, whenever the React Query devs make any internal changes, your test may break! 2. Mocking a network layer is a bandaid solution to the real problem: your abstractions are leaking. Basically, since you don't know how state's changing inside your hooks, you have to test the behavior on a higher layer. The real solution's obviously being in control of YOUR hooks' internal state. Since you mentioned React Context, I have the same problems with it and hence never use it.
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
​@@evergreen-I guess you'd probably make it a mission remake most popular react libs in-house
@evergreen-
@evergreen- 2 ай бұрын
@@zayne-sarutobi , you should be constantly remaking simple things to fit just your needs. If later you come across a problem that your solution cannot solve, at least you will have a clear reason of why you need a complex external dependency. Compromising on certain things (such as ease of testability) from the get-go to just use a library will only lead to bigger and more painful compromises down the road.
@paw565
@paw565 6 ай бұрын
It's great, but I bit weird in nexts js with ssr
@hassanad94
@hassanad94 6 ай бұрын
What is your opinion on SWR?
@philheathslegalteam
@philheathslegalteam 6 ай бұрын
Its better
@ark_knight
@ark_knight 6 ай бұрын
its simpler and works for most cases.
@hassanad94
@hassanad94 6 ай бұрын
@@ark_knight Yea, i think the same.
@hassanad94
@hassanad94 6 ай бұрын
@@philheathslegalteam For side projects i think its better, i dont know it in big scale... Maybe its better there too :)
@Pixelume
@Pixelume 6 ай бұрын
I love React Query. Just wish there was an easy way to use it with the new RSC model. Or maybe there is, but I haven't found a straight forward explanation for this yet.
@_y7ya
@_y7ya 6 ай бұрын
Use it only with server actions when you need to mutate data. For anything else drill down data from the server.
@Pixelume
@Pixelume 6 ай бұрын
@@_y7ya Yes, but it would be nice to have the data in React Query's cache so I can just retrieve it from any component as opposed to prop drilling it down to where I need to access it.
@TkDodo
@TkDodo 6 ай бұрын
@@Pixelume The Advanced SSR section in the docs cover streaming from server components where you pre-fetch on the server, pass the promise down and then "pick it up" on the client. There will also be a lesson about this in the course.
@Pixelume
@Pixelume 6 ай бұрын
@@TkDodo Hi Dominik. I'm a big fan of your blog. That's great, thank you so much for this, I'll check it out and I'll definitely check out the course. 😄
@lukemontana9792
@lukemontana9792 6 ай бұрын
great video
@s3rit661
@s3rit661 6 ай бұрын
14:13 I strongly disagree, in Flutter/Dart it's much easier
@vivekthapa5979
@vivekthapa5979 6 ай бұрын
Nice video . Can you show how to create Progressive Web Application using nextjs? I think this will be useful for lots of developer. Thanks in advance.
@1989amcm
@1989amcm 6 ай бұрын
3rd...Shoutout to the early risers and the late night grinders xoxoxo
@DMZT_dhruv
@DMZT_dhruv 6 ай бұрын
16:19 add the ts now, it's even worse and big
@camilo5821
@camilo5821 6 ай бұрын
i lov tanstack libraries
@Dimonina
@Dimonina 6 ай бұрын
I don't like holywars in comments, but still when I look at some libraries developed for react, I wonder why devs just don't use angular, where all these problems of race conditions have been solved from the very beginning in RxJs. one operator (switchMap) cancels the current request and starts a new one with new parameters if something changed. Of course Angular has its own cons, but for the last 4+ years I've been observing that many new libraries for react are solving problems, that in rxjs world just don't exist.
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
I guess the added complexity angular brings for what it solves, isn't worth it to most devs
@neociber24
@neociber24 6 ай бұрын
This ks not exactly a React problem, any frontend framework needs to manage async data, that's why react query exists for different frameworks
@rianby64
@rianby64 6 ай бұрын
This is not a flaw in React. It's the nature of the component-fetching stuff! It's because of the PROMISES!!! Hahahahahaha the promises like a very strange artifact of having concurrency. Wish you a nice day!
@w1pe0ut
@w1pe0ut 6 ай бұрын
Rick Ross's 'Huh' is a trigger:D
@CeezGeez
@CeezGeez 6 ай бұрын
i for sure know i've written cursed effect fetchers before lol
@vlad6703
@vlad6703 3 ай бұрын
the fact that he didnt mention 'staleTime' first tells me he doesn't even use react query. maybe his team does but he's not a hands-on user
@korczas
@korczas 6 ай бұрын
I don't like in React Query that it forces short-polling everywhere. I don't think it is a good approach.
@TkDodo
@TkDodo 6 ай бұрын
can you elaborate? It doesn't force anything :)
@guanbo-yang
@guanbo-yang 6 ай бұрын
Is it a bad idea to use React Query for global non-async state?
@TkDodo
@TkDodo 6 ай бұрын
I always advise against doing that, because React Query isn't made for synchronous state, so it isn't very good at it. It can work if you get all the settings right, but really using something like zustand is a lot better.
@guanbo-yang
@guanbo-yang 6 ай бұрын
​@@TkDodo Thanks for your response! In my case, the need for global state is just so tiny that I'm not sure if I want zustand to handle it. Perhaps a global react context is fine I think?
@serhiipylypenko
@serhiipylypenko 6 ай бұрын
@@guanbo-yangjust use jotai then It’s basically a usestate that you can access anywhere
@mubashir3
@mubashir3 6 ай бұрын
Almost every day I see people/Theo discover new solutions to problems Relay solved years ago.
@stacked-dev
@stacked-dev 6 ай бұрын
LOL I am working with next js 14 which automatically manage all of this stuff
@starnumber_alt
@starnumber_alt 6 ай бұрын
It does?
@stacked-dev
@stacked-dev 6 ай бұрын
@@starnumber_alt Yes you can use the latest version of next js where you can utilzie to server actions to fetch data and you can use path validation to refresh the data on demand. IT is amazing but you should avoide working with next js where SEO does not matter to your project like dashboard etc but in the case of websites it is worth using
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
​@@starnumber_altIt really doesn't tbh
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
It really doesn't tbh
@BRP-Moto-Tips
@BRP-Moto-Tips 5 ай бұрын
long live React query!
@sunny-unik
@sunny-unik 5 ай бұрын
It's not 'How React Query Won' it is 'How uidotdev Won'
@dramen555
@dramen555 6 ай бұрын
SWR forever!
@tonypolinelli
@tonypolinelli 6 ай бұрын
SWR syntax is so much nicer. I wish RQ didnt adopt this new object styntax, its so clunky
@zayne-sarutobi
@zayne-sarutobi 2 ай бұрын
​@@tonypolinelliActually, it unlocks a superb way to abstract queries at the options level! Check out tkdodo's blog post on that if you will
@miksica
@miksica 6 ай бұрын
Yo, rect quiiiry let's go
@portusdelphini
@portusdelphini 6 ай бұрын
Fucking magic.
@Fanaro
@Fanaro 6 ай бұрын
Too expensive, especially for anyone who doesn't earn in dollars.
@kakterius
@kakterius 6 ай бұрын
sudden German in a video XD "Zustand" means state and is pronounced tsoo-shtunt
@aberbaCodes
@aberbaCodes 3 ай бұрын
Doesn't look much different from SWR
@nikilk
@nikilk 6 ай бұрын
React Query is not going anywhere.. Ahmm.. NextJS server side fetching :D, unless you wanna client side fetch ..
@nickwoodward819
@nickwoodward819 6 ай бұрын
Their tutorial pricing is nuts
@adeptiworks
@adeptiworks 6 ай бұрын
So it's like Redux Toolkit Query but better?... I'm sold, gonna try it on the next pet project
@Michaeltje01
@Michaeltje01 6 ай бұрын
I'm curious, what makes it better than RTK query for you?
@СергейМихеев-е8я
@СергейМихеев-е8я 6 ай бұрын
​@@Michaeltje01 for example out of the box support for infinite queries and easier api to handle without some abstractions - you can basically put your js async function with fetch inside the queryFn and it will just work. I worked with both of them. for me it feels like rtk-query is more like a 'framework' way to do asynchronous state management, while react-query is a 'library' way to do so, also wanted to add that it's just a tool and you should use what suits your project most :)
@Michaeltje01
@Michaeltje01 6 ай бұрын
​@@СергейМихеев-е8яI hadn't seen the infinite query functionality mentioned before, that's neat! Thanks
@stacked-dev
@stacked-dev 6 ай бұрын
Redux Toolkit query is best for project where you are already using the redux. But on the other hand if you are not using you should use the RTQ. I preffer Next js because it handle all of this stuff
@relaxwithai
@relaxwithai 6 ай бұрын
Less boilerplate, SSR support, optimistic update support, can be used for all async not just AJAX... etc My thinking now is that If the project doesn't require client state that is better implemented with redux toolkit... use react query. Fortunately nowadays even if the project requires client states, I would rather go for something like Zustand and context before considering redux toolkit.
@henriquematias1986
@henriquematias1986 6 ай бұрын
The weakeast part of React Query is the documentation.
@abdelhakimkhabir
@abdelhakimkhabir 5 ай бұрын
Can't write tutorial code in work. obvious people
@sad_man_no_talent
@sad_man_no_talent 6 ай бұрын
I am gonna unsubscribe if u say anything bad about react again
Why Everyone Loves Zustand
29:27
Theo - t3․gg
Рет қаралды 113 М.
The Story of React Query
8:55
ui․dev
Рет қаралды 115 М.
Правильный подход к детям
00:18
Beatrise
Рет қаралды 11 МЛН
VIP ACCESS
00:47
Natan por Aí
Рет қаралды 30 МЛН
She made herself an ear of corn from his marmalade candies🌽🌽🌽
00:38
Valja & Maxim Family
Рет қаралды 18 МЛН
Une nouvelle voiture pour Noël 🥹
00:28
Nicocapone
Рет қаралды 9 МЛН
Tailwind V4 is WAY better than I expected
30:17
Theo - t3․gg
Рет қаралды 128 М.
Six Years Later, I’m Over GraphQL
34:40
Theo - t3․gg
Рет қаралды 73 М.
Going Back To Next
45:09
Theo - t3․gg
Рет қаралды 83 М.
How Shadcn/ui ACTUALLY Works
32:38
Theo - t3․gg
Рет қаралды 109 М.
Why I Quit Copilot | Prime Reacts
35:56
ThePrimeTime
Рет қаралды 326 М.
I Waited 3 Years For This Router. It STILL Blew My Mind.
21:30
Theo - t3․gg
Рет қаралды 104 М.
Combining Zustand with React Query
20:24
Cosden Solutions
Рет қаралды 30 М.
Why Everyone Hates Web Components
1:22:39
Theo - t3․gg
Рет қаралды 83 М.
Next Gen Fullstack React with TanStack
1:02:33
Syntax
Рет қаралды 15 М.
I tried React and it Ruined My Life
1:19:10
Tsoding Daily
Рет қаралды 156 М.
Los abanicos holográficos están a punto de revolucionar el negocio
0:23
Самая топовая материнка в мире!😳
1:12
Корнеич
Рет қаралды 481 М.
PS5 + PS5 = ⁉️
0:22
Gleb POV
Рет қаралды 3,1 МЛН
🤡Главная ПРОБЛЕМА Айфона🍏
0:39
Demin's Lounge
Рет қаралды 639 М.
Which one made you like this video?#keyboard
0:32
Tapkx
Рет қаралды 10 МЛН