Next.js - Incremental Static Regeneration (ISR) and Static Site Generation (SSG)
In this video, we will go through the new Incremental Static Regeneration (ISR) in Next.js. In order to explain and understand ISR, we will do a summary around Static Site Generation (SSG). We will look into fallback: false and fallback: true and revalidate property of getStaticProps.
We will have a demo built and deployed to Github Pages to show the Static Site Generation capabilities of Next.js - For some use cases, we don't even need Next.js at runtime, just at build time.
During the video, we will see how we can recreate/regenerate a page that was developed using static site generation just by adding revalidate property in getStaticProps.
At the end of the video, we will have a look into an unstable feature, fallback: "unstable_blocking" which can be useful when sharing our pages to social media platforms.
-----
The next description is a "Copy-paste" from Next.js Blog Post + Documentation:
Stable Incremental Static Regeneration
Next.js introduced Static Site Generation methods in 9.3 with a clear goal in mind: we should get the benefits of static (always fast, always online, globally replicated), but with excellent support for dynamic data, which Next.js is known for.
To get the best of both worlds, Next.js introduced Incremental Static Generation, updating static content after you have already built your site. By using the fallback: true option in getStaticPaths, you can register new static pages at runtime.
----
----
Timeline:
00:00 Introduction
02:00 Static Site Generation (SSG) Demo
03:12 Code explaining the Demo including getStaticPaths, getStaticProps and fallback
05:29 Deployed to Github Pages with SSG fallback: false
06:35 Explaining SSG fallback: true
08:17 Code SSG fallback: true
11:50 Incremental Static Regeneration (ISR) Introduction
14:14 ISR Timeline
15:57 ISR Code and Demo
19:02 Unstable feature --- fallback: 'unstable_blocking'
21:28 Conclusion
----
----
GitHub Pages Microphone App: https://bmvantunes.github.io/micropho...
----
GitHub Repository: https://github.com/bmvantunes/youtube...
----
Microphone Store Video: • Next.js Tutorial - Part 8 | Static Si...
getServerSideProps Video: • Next.js Tutorial - Part 9 | Data Fetc...
----
Next.js Blog: https://nextjs.org/blog/next-9-5#stab...
Next.js ISR Documentation: https://nextjs.org/docs/basic-feature...
----
----
Follow me on:
Twitter: / bmvantunes
Dev.to: https://dev.to/bmvantunes
Website: https://brunoantunes.net
Github: https://github.com/bmvantunes
LinkedIn: / bmvantunes
Watch video Next.js - Incremental Static Regeneration (ISR) and Static Site Generation (SSG) online without registration, duration hours minute second in high quality. This video was added by user Bruno Antunes 19 August 2020, don't forget to share it with your friends and acquaintances, it has been viewed on our site 15,543 once and liked it 831 people.