‘Static generation’ (SSG) generates data at build time or when we run npm run build. It will generat all of the HTML files for us, which we then served statically. This makes our website fast for the users that visit it.

In Next.js, SSG is achieved through a getStaticProps function. This function can be exported from any page in Next.js and will fetch and build data for that page at build time. Next.js Strips this method from the bundle so it’s safe to use database connections and API secrets inside of.

You will often need to generate dynamic pages in combination with getStaticProps. To do this you will need to also export a function getStaticPaths that tell Next.js what pages to generate.

After you learn the getStaticProps api and what SSG looks like when you build, we’ll add set revalidate to an interval inside of getStaticProps which will let us tap into Next.js’ Incremental Static Regeneration feature. This will have the server rebuild the data at a set interval so our site can update for new users.