How to schedule your static site deploys with Netlify and Gitlab
Last year I decided that my goal was going to be to relaunch my comic, Tavern Wenches, at the beginning of 2020. Unfortunately, I’m the type of person who will tell myself “Hey, since I’ve decided to tackle this big project of relaunching a comic, why not double my workload and build a new site from scratch while I’m at it? After all, you want to make a comic that was responsive and accessible, don’t you?” (My inner product owner LOVES scope creep). And so Operation Relaunch My Comic quickly increased in scope and the next few months were a mix of writing, art, and coding depending on what I was in the mood for that day (or most stressed about).
After playing with a few different ideas for a tech stack, I decided on making the comic website using Hugo and NetlifyCMS (something I’ll write about more in the future). I host the comic on Netlify with the code in a private repo on GitLab. For the first three weeks, I manually deployed my site on Monday at midnight, launching the new page of my comic to the world.
However it should be noted that I am a lazy individual, even if I do have a tendency of getting a bit extra in my side projects. I quickly decided manually deploying my site every Monday at midnight was a waste of time. I had so many other things I could be doing. Like sleeping! Or binging Youtube! Or working on next week’s comic! Or rolling up a new D&D character!
So during a lunch break while enjoying leftover tacos (the lunch of champions), I set up an automated scheduled deployment for my site using Netlify and GitLab.
For the purposes of this tutorial, I’m going to assume you already have a site hosted on Netlify, and the code for it is on GitLab.
First off, you’re going to log into your Netlify account, select the Site you want to schedule deploys for, and then go to Settings > Build & Deploy > Continuous Deployment and then scroll down to Build hooks.
It should look something like this:
Click on the Add build hook button, which should open a form asking for a Build hook name and a Branch to build:
For Build hook name, call it whatever you want. I called mine “Midnight Deploy” because sometimes I’m lacking in originality on my build hook names. Click on Save and you’ll be able to see your build hook address all ready to go:
Copy the url listed next to your build hook name. Next you’re going to go to your project on your local computer, and create (if there isn’t one already) a file called .gitlab-ci.yml in the root of your project. In the file add the following (with the url updated to be the one you got from Netlify):
Basically what this does is when you have a scheduled job occur in GitLab, it will run that script that lets Netlify know you want to deploy your site. Commit that code and push it to GitLab.
Next you’re going to log into GitLab in your browser, navigate to your project, then go to CI /CD > Schedules from the left sidebar menu. That page should look something like this:
Click on the New schedule button, which should open up the Schedule a new pipeline form
Describe your new pipeline with something memorable (I went with “Midnight Deploy Party” because I had finished my tacos at this point and felt like partying). There are some options listed for how often you want to have this pipeline to occur, and I decided to have this job run every night at midnight so I selected the Custom option with the pattern “0 0 * * *”. Select a time zone if you so choose, but otherwise you can keep everything at the default settings. Your form will look something like this when you’re done:
After that, click on the Save pipleine schedule, and that will take you back to the Schedules list with your new pipleline listed. To test if the scheduled pipeline will trigger a deploy, click on the Play button, on the right hand side of that row in the table.
You should get a notification that says something like “Successfully scheduled a pipeline to run. Go to the Pipelines page for details.” You can go to the Pipelines page if you want (that just lets you know if the script is still running), but to really test if this worked, go to Netlify and open up the Deploy tab on your site’s website. If everything is set up correctly, you should see a notification that your site is being built, having been triggered by your build hook:
Once that is published, your updated site should be available to the world!
As a final confirmation, make sure to check back after whenever your actual scheduled deploy is supposed to occur, just to make sure the timing is set up correctly, but otherwise feel free to bask in the knowledge that you no longer need to manually deploy the new content for your website.
