The best way to write queries with Tanstack Query (React Query)

You'll learn how to write a useQuery hook the proper way. You will have more flexibility, better scalability, type safety, better readability and confidence in your code.

#react #reactquery #axios

[vadimivanovich]

Somehow I ended up using the same pattern on my own. Thank you for spreading good ideas 💡

[VuNguyen-bqog]

tldr: move useQuery part to a reusable hook

[kylelambert__]

This is useful, but you don’t need to define a constant for the query key. The return type from the queryOptions helper has the queryKey property on it.

[codermeloman]

Thank you!, Please more tanstack with Next.js content, prefetchQuery and others...

[oribenez]

Thanks you very much I like it!
what do you do if you have also a useMutation do you place it in the same file of the hook? or you create a new file for that?

[TheKobraIRAQ]

what if i want to use the search paramter with a search bar using this api to get the searched results paginated also so the dependency of the query not only the page state aslo the word that the user searched for and its should be a func that fire when user press enter key or clicked on some button thats trigger a req to get the resluts from the api im struggling with that becuase if i make a state to store the search word from the input and i passed it to the query when ever the user try to type in the inputs its refetch the data can you please help me out with this