Pre-Generate Static Pages with Next.js

Jon Meyers
InstructorJon Meyers

Share this video with your friends

Send Tweet
Published 4 months ago
Updated 2 weeks ago

In this lesson we will learn how to generate static pages at build time using the getStaticProps function in Next.js. This ensures that, in production, load times will stay fast as the data is already present on the page when a user navigates there.

We will build a Breaking Bad quote generator and learn the differences between running in development mode and production. The main difference being Next.js will re-build the page for you in development every time you visit it where a page only gets built once in production. This can lead to slightly different behaviors in dev vs production that you need to keep in mind.

Garrett
Garrett
~ 3 weeks ago

For those following along with the code, the url for the breaking bad quotes does not work.

Brian
Brian
~ 3 weeks ago

Ha! The first thing I was going to try. Thanks Garrett.

Jon Meyers
Jon Meyersinstructor
~ 3 weeks ago

Thanks for letting me know! Looks like the Breaking Bad Quote API is down 🙁 I have reached out to the maintainer to see if we can fix it 🤞