Static Generation Overview

Next.js can pre-render pages at build time and reuse the generated HTML for each request. This works well for content that does not change on every visit, such as articles and portfolio pages.

Pages without external data

A page that exports a React component can be generated ahead of time:

export default function About() {
  return <h1>About</h1>
}

Pages with external data

Use getStaticProps to load content at build time. For dynamic routes, use getStaticPaths to declare which pages should be generated.

See the Next.js static generation documentation for examples.