CODEWITHSUNDEEP
next.js
Efi Gordon
Efi Gordon

Reputation: 446

Next.js Static Generation

I have built a website using next.js The guide says that next.js has Two forms of Pre-rendering:

Static Generation (Recommended): The HTML is generated at build time and will be reused on each request. Server-side Rendering: The HTML is generated on each request.

If I am using Static Generation, an let say in my page I have the following code:

export async function getStaticProps({ params }) {
    const fetchedData = await axios.get(API_URL);

    return {
        props: {
            fetchedData
        }
    }
}

Does this mean that this function will be executed only once at the build (when I am deploying the website) and then it means that the data that will be presented on the website will be old data from the date of the deployment? And if so, how can I force next.js to rebuild this page every day?

Upvotes: 1

Views: 2130

Answers (2)

Martin Cifko Štefček
Martin Cifko Štefček

Reputation: 493

I just started using next.js. And I'm using firebase hosting. The getStaticProps can be called at request time.

  • If you have fallback set to true. Then for any path included in getStaticPaths will be build at request time. (I do this, because I have a blog, and I don't want the build time to be in minutes...)
  • Other options is what you wanted, and it's called incremental static regeneration. Basically it rebuilds the page on request time if the last request was a time ago(you set this in seconds).

Upvotes: 2

Efi Gordon
Efi Gordon

Reputation: 446

OK the answer is Yes, the data that will be presented is the data the was fetched on the build time (e.g the deployment time), so basically if the data on API changes, the site still has the old data.

about the second question - how to force next.js to rebuild the page every period of time - I found a suitable solution for me (because I'm using Vercel hosting):

https://vercel.com/docs/v2/more/deploy-hooks?query=Deploy%20Hooks#

Upvotes: 2

Related Questions