CSR / SSR / SSG / ISR with Next.js – Explained!

00:00 – Intro
08:23 – Static Site Generation (SSG)
09:31 – Incremental Static Regeneration (ISR)
11:19 – getStaticPaths()
12:26 – Server Side Rendering (SSR)
13:31 – Client Side Rendering (CSR)
15:42 – Hybrid Framework
16:54 – Q&A

[tevoj]

THIS is the video that I was waiting for. Thanks!

[Lucas-gten]

This is the exact video I didn't even know I was looking for. Great information but also perfect presentation. Thank you so much!

[bhatvikrant]

This is the best video format ever! It cleared so many doubts for me! Thanks Lee and everyone else.

[shawinmendis]

Nice one mate best tutorial out there on CSR/SSR cheers

[isaacfrost]

I learned a lot from you, thank you looking forward to learn more.

[vasileturus]

OMG you are such a great guy! Please, please keep doing these more often! This is gold! I really like your energy and (I'm 27) but you're my model of developer! Much love!

[huthayfa]

Thank you Lee for the presentation, that was really helpful.

Timestamps for the vid : 

00:00 Intro
01:56 What's Nextjs?
08:23 Static Site Generation - SSG
09:31 Incremental Static Regeneration - ISR
11:19 getStaticPaths()
12:26 Server Side Rendering - SSR
13:31 Client Side Rendering - CSR
15:42 Hybrid Framework
16:54 Q&A

....

[reepinc]

58:05 Beautiful Martin guitar. Would love to hear you play sometime!

[mickmath]

Great! Trying to convince my team to move forward with NextJS on our next development build. Can I get a copy of this deck?

[michael.knight]

Really well explained. I'm switching from Gatsby to Next, and thinking of following your NextJS course. Is it still up to date? Or have many things changed recently?

[nestaxu]

Love all of your videos. The idea of `revalidate` is great, but is it really ok to show stale data for the first user(s) or first load(s)? Users happening to see stale data wouldn't know they'd have to load the page twice (or even multiple times if ISR is slow in some cases) to make sure that the data they are seeing is up-to-date. They might well trust the data they are seeing in the first place and not refresh the page again.. I suppose we wouldn't want this in real time data critical applications. What's your thought about this trade-off?

[gablabelle]

Thanks Lee! Would you mind sharing the slides? If possible and with your permission, I'd like to use a few of them for an internal presentation where I work. We're moving to NextJS for our new micro-frontend architecture and this would greatly help for the developers' onboarding.

[sidonaldson]

I like the concept but the missing link seems to be updating the static paths. If I add a new page the only way to generate it would be to try to hit the link on the live site so the site then fetches it for next time. I would prefer to also update the static paths.

[adebiyial]

How is ISR practically different from Deploy Hooks (WebHooks). I use Deploy Hooks to fetch updated data for Sanity on my website. So when I make a change on Sanity, it triggers a full rebuild. Is ISR different in that there won't be a full rebuild, my website just updates?

[monirshimul]

Can you make a video on how the next js server actually works under the hood?

[Shakuurally]

I know this is year ago but how can i use redux toolkit with next js data fetching

[prsolo]

where should i make my connection to mongodb database so it only needed to run once ...or you can tell me the best way to do it in nextjs

[adamtak]

If you're using ISR, isn't sending requests to the backend every 1s, 30s, 60s etc bad? Why not just fetch the data when someone requests the page again and stick with SSR?

[adebiyial]

I don't think the "Loading State" question was fully answered. With client-side data fetching, SWR can tell you if the data is in the loading state. What if one was using one of the Next.js in-built data fetching function like getStaticProps, getServerSideProps, how do you get the loading state?

[thesobercoder]

Excellent video. Thanks Lee. I do have one thought, why is there no official documentation for deploying NextJS app to AWS or other providers? Not everyone would want or can deploy to Vercel.