General Question on Client & Server Components!!!
Unanswered
Parson Russell Terrier posted this in #help-forum
Parson Russell TerrierOP
this is my main layout code
and this is provider code, i will be importing all contest and wrap my children with that context
so my question is, since react-context contains hooks so it will be client component, by default all routes will be client side rendered? and if yes than i cannot use server components as we cannot use server components inside client component ?
<ClerkProvider>
<html lang="en">
<body className={openSans.className}>
<Providers>
{children}
</Providers>
</body>
</html>
</ClerkProvider>and this is provider code, i will be importing all contest and wrap my children with that context
<>
<Toaster position="top-center" reverseOrder={false} />
{children}
</>so my question is, since react-context contains hooks so it will be client component, by default all routes will be client side rendered? and if yes than i cannot use server components as we cannot use server components inside client component ?
3 Replies
interleaving server and client components is a expected pattern, explained here in the docs: https://nextjs.org/docs/app/building-your-application/rendering/composition-patterns#interleaving-server-and-client-components
if your client component renders a server component the server component won't be changed at all
if your client component renders a server component the server component won't be changed at all
Parson Russell TerrierOP
its written here server cannot be imported inside client so how can server even renDER INSIDE CLIENT/?
you can check here for an explanation https://nextjs-faq.com/client-components-wrapping-server-component-children