Hugo site on Netlify, CloudFlare and apex domain

Subscribe to my newsletter and never miss my upcoming articles

Today my Let's encrypt certificate expires. I used to have a Google Cloud compute instance to run HTTP server that serves the static content. As I'm trying to move entirely to SaaS model, I decided to decommission the server and move the site to Netlify. The site is static html generated by hugo . So here is what I did.

From Netlify dashboard, you need to select “New site from git”. Netlify will then start walking you through the steps necessary to setup continuous deployment. First, we need to "install Netlify application" to GitHub repository that hosts our site.

Annotation 2020-02-29 205140.png

After some obvious steps, you’ll be brought to a screen for basic setup. Here you can select the branch you wanted published (master), your build command (hugo), and your publish (i.e. deploy) directory (/public).

Annotation 2020-02-29 205141.png

Please note that hugo themes must be installed as git submodules:

git submodule add https://github.com/zwbetz-gh/cupper-hugo-theme.git themes/cupper-hugo-theme

And it was all to deploy the site. From now on every single change to the git repository will automatically build and (re)publish your hugo site. What was left for me was to reconfigure site origins in ClaudFlare dashboard to point to newly created Netlify site and enable custom domain on Netlify. I have already covered this in one of my previous posts. All what is needed:

  1. Generate Origin Certificates in CloudFlare Dashboard.
  2. Upload Origin Certificates to Netlify - "Provide your own certificate" button.
  3. In CloudFlare create/modify CNAME DNS entry. Note that CloudFlare does DNS flattening, but it works OK with Netlify.

No Comments Yet