Previously on my personal website, the blog content, after converting it back to Static Site Pages, I figured out that you can use webhooks to trigger rebuilds. As both Vercel (the hosting provider) and Prismic (the headless CMS provider) have support for webhooks. To do this, we are going to try and trigger a build on the creation and deletion of blog-posts documents.

Firstly, we go into our Vercel project and create a new webhook, to do this:

1. Go into Settings in your vercel project
2. Click on Git in the sidebar
3. scroll down to Deploy Hooks
4. Fill in the blanks (I named my hook Prismic (Production) and had it target my production branch which is main), then click create.

Now copy the webhook URL into your prismic screen (under Settings → Webhooks), give it a name and paste the URL. then hit Add this webook!

Now you should be able to trigger it, try it out and look under your Deployments tab in Vercel to make sure it works.

And there we have it, static page generation (hopefully) for blogs using NextJS, Vercel and Prismic (with Webhooks!)

Amendment

Following a discussion on Twitter with @timneutkens, you dont need to use webhooks as of NextJS v10. All you need to do is add fallback: blocking to your getStaticPaths response.

Similar Posts