How to server-render (SSR) a client component using Next.js app router?
Hey folks,
This question might seem a little confusing. I'm learning about the app router and I'm wondering how I can achieve server-side rendering of the client components in the app router?
I want the client component first render to be server-side, then the client component gets hydrated, then the subsequent rerenders will be client-side. This is needed for SEO.
I've been looking at this app router example: https://netflx-web.vercel.app/ (source: https://github.com/sadmann7/netflx-web). What I noticed is that if you disable javascript, the website doesn't show the list of shows. Ideally, I would like this to show a list of shows even if JS is disabled.
Netflix Web
Netflix Web
An open source Netflix clone built using the new app router, server components, trpc, and everything new in Next.js 13.
2 Replies
isn't that just....... ISR?
Nope, ISR is something else. I was wondering how to get getServerSideProps-like behavior in App Router (first render is SSR, then hydration, then subsequent rerenders are client-side), but in my own testing that already seems like the default behavior with App Router Client Components. Now, I still don't know why the example I linked doesn't do that, so will have to dig in further.