Is it a good idea to use tanstack query with nextjs and server components?
As I understand, when using something like tanstack query, I just ask for the server state or data in the component where I want to use it, and behind the scenes, these requests are optimized.
With NextJS though, inside server components, we have access to the server state directly, so we do not need a server state management tool like tanstack query. However, we still need to share the server state with client components.
What is the recommended way, what are my options?
The options I can think of, with my limited knowledge:
- Pass the server state from sever components to client components with props. Do prop drilling basically. Which does not work, if we have say more than 3 client components nested.
- Use the context api, create a provider at the server component that is the common parent of the client components that need the same data, which is possibly the application's root component.
- This is more of a question, since I haven't tried: maybe use tanstack query, create a provider at the root. I am thinking this may be necessary if I want to be able to handle loading, error and success states, without a custom implementation.
Can you help me clarify this topic?
I would be super grateful for some wisdom, if you shared your opinion.
With NextJS though, inside server components, we have access to the server state directly, so we do not need a server state management tool like tanstack query. However, we still need to share the server state with client components.
What is the recommended way, what are my options?
The options I can think of, with my limited knowledge:
- Pass the server state from sever components to client components with props. Do prop drilling basically. Which does not work, if we have say more than 3 client components nested.
- Use the context api, create a provider at the server component that is the common parent of the client components that need the same data, which is possibly the application's root component.
- This is more of a question, since I haven't tried: maybe use tanstack query, create a provider at the root. I am thinking this may be necessary if I want to be able to handle loading, error and success states, without a custom implementation.
Can you help me clarify this topic?
I would be super grateful for some wisdom, if you shared your opinion.
