Background #
Earlier this month, Netlify announced their acquisition of Quirrel and subsequently announced the availability of Netlify Scheduled functions in Beta. Scheduled functions are serverless cron jobs that run periodically alongside your Netlify site. I just started using this feature for my blog to automatically deploy my site. Let's dive in to see how you can too!
As you might already know, this blog is built using 11ty and hosted on Netlify. One of the features I wanted while building the blog was a project page to list my GitHub projects. The page also has displays the number of GitHub stars for each of the project.
Instead of hardcoding this information, I used a 11ty filter that fetches that information from the GitHub API. Any time the blog is deployed, the project description, language and stars are updated. The disadvantage of this approach is it gets out of date if I haven't published a blog post for a while. To fix this, we can use Netlify Scheduled functions to deploy the website periodically.
Steps #
Before we start, we need to enable Scheduled Functions in Netlify Labs and install the required dependencies. We also need to create a new build hook for the site to allow us to trigger builds from our function.
Navigate to Netlify > Your site > Site Settings > Build & Deploy > Build hooks. Use the "Add build hook" button to create a new build hook and choose the branch to deploy from. Once done, you should see a URL for your build hook.
This URL should be kept as a secret. Let's add this to our environment variables as SCHEDULED_DEPLOY_HOOK_URL
, so it can be referenced within our function.
The next step is to install your dependencies and add your function under the ./netlify/functions
folder in your project.
npm install @netlify/functions
npm install node-fetch@2.6
mkdir -pv ./netlify/functions
touch ./netlify/functions/scheduled-deploy.js
The function is pretty simple - we register a new handler that sends a POST
request to the Webhook URL whenever the function is triggered.
// scheduled-deploy.js
const fetch = require("node-fetch");
const WEBHOOK_URL = process.env.SCHEDULED_DEPLOY_HOOK_URL;
const handler = async function(event, context) {
console.log("Rebuilding site. Received event:", event)
await fetch(WEBHOOK_URL, {method: 'POST'});
return {
statusCode: 200,
};
};
module.exports.handler = handler;
After adding the function, we can specify the cron schedule for the function in our netlify.toml
file under the project's root directory. The following schedule specifies that the function should every three days at 00:00 UTC. This means that the GitHub project info would be out of date for upto a maximum of three days. We can update the schedule to run it more often depending on how often your projects are updated/starred.
# netlify.toml
[functions."scheduled-deploy"]
schedule = "0 0 */3 * *"
Run netlify deploy
(or commit to the repo if you have git integration enabled) to deploy your site and your function. The next time your function runs, you should see the site update.
Bonus #
The projects page on my blog displays when the information was last updated. I find this to be a handy way to verify your site's build time and also verify your function ran successfully. As a bonus, it also subtly conveys to the reader that the information on the page might be slightly out of date.