children

On-demand ISR

On-demand ISR invalidates the cache of a single url only when calling a specific /api url with the correct query parameters.
On-demand ISR will be evident only if you have some data changing on an endpoint after the pages have been statically generated at build time. A classic example would be a content editor changing some value on your headless CMS.

For this example, you will need to create a new API on MockAPI.io. Using this free API builder will allow you to modify the data and consequently showcase on-demand ISR.
You will need to create a new project in BuildAPI.io and a new API route within the project called `/posts`, that will have a list of elements with a title. Go ahead and generate some data for that specific url.
You will need to create a new ENV variable in env.local adding your token for REVALIDATION_TOKEN.
You will also need to create a new MOCKAPIIO_URL variable in env.local for your own personal MockAPI.io url.
Using Vercel: these same ENV variables will need to be on your Vercel project as well within the Vercel Platform.
Run `yarn build && yarn start` to build and run a production deployment on localhost (a dev environment will not showcase statically generated pages, same as regular ISR).
Change some data in your API: and save the new data on MockAPI.io.
Try to refresh: the page will not change its data.
Call the revalidate function visiting `/api/revalidate?secret=yourSecretToken&id=yourPostId` url on a new browser tab.
Now refresh the page: data for that Post id has been revalidated, on demand.