How to use server components when using react.contexts globally?
Unanswered
Asian black bear posted this in #help-forum
Asian black bearOP
Hello everyone,
Typically, my Next.js applications are encapsulated within multiple React context components. These contexts usually hold data, such as user information and app theme, making them "client components" due to their use of hooks. Does this imply that my entire application will function as a Client Component? Or can certain parts still be designated as Server Components?
Is my approach to designing next apps generally considered a bad practice? If so, what modifications should I make?
Thank you.
Typically, my Next.js applications are encapsulated within multiple React context components. These contexts usually hold data, such as user information and app theme, making them "client components" due to their use of hooks. Does this imply that my entire application will function as a Client Component? Or can certain parts still be designated as Server Components?
Is my approach to designing next apps generally considered a bad practice? If so, what modifications should I make?
Thank you.
10 Replies
joulev
children of contexts can be server components. server components wont be able to get the data of the context though, so indeed you might need to rethink the architecture of your application
Chinese Alligator
I'm having the same "issue" here. With this new paradigm that is Server Components, I think our way to pass/access data through the application will change but I still don't know how to manage that.
joulev
quite a lot of changes to the mindset is needed
you no longer fetch everything at the root and put everything to global contexts
now you just fetch whenever you need it
it's like now you have
getServerSideProps everywhere and you need to use it in place of react contextswhen it clicks, it will make a lot of sense
Chinese Alligator
Exatcly that! I'm trying to narrow down the client components as deep as possible but what if I need to pass props from different client components in different levels, do I still use hooks for that? Have you checked something called Signals?
Chinese Alligator
@joulev, this is a good article to check: https://frontendmastery.com/posts/rethinking-react-best-practices/
Asian black bearOP
Thanks🙌