Skip to content

Building Hugo CICD pipeline on Microsoft Azure

On my previous post, I have outlined on how to host Hugo generated website on Amazon S3 and serve it with CloudFront CDN. Even though it works flawlessly, it is still not possible to get CloudFront to support Simple URL without the use of Lambda@Edge.

Therefore, I have decided to enable Simple URL and move to Microsoft Azure Blob storage and serve it with Azure CDN.

I have decided against implementing Lambda@Edge because I feel…

  1. Introducing Lambda@Edge an unnecessary hurdle.
  2. I am open to using Microsoft Azure or other Cloud Providers and not tied to AWS.

How it is all done with Azure

The CI/CD deployment of Hugo website works in the following order.

CICD

  1. The entire Hugo directory is hosted on cloud storage where I can access from multiple computers.
  2. The working Hugo directory is synced to a repository in Github.

I have decided not to sync the **themes/** directory via **.gitignore** file. This is because I am tracking my theme via a separate repository. If you plan on not syncing other directories, then **.gitignore** method can be used.

  1. The published Hugo public/ directory is also written to the Github directory as mention above. This will give me an option to version control the public HTML files.
  2. Every time there is a git push command, there is a .yaml file in .github/workflows/ will invoke the function to copy the content from public directory to Azure Blob storage.
  3. The copied content from the public/ directory is served by the Azure CDN.

The YAML file

on:
 push:
 branches:
 - master
jobs:
 upload:
 runs-on: ubuntu-latest
 steps:
 - uses: actions/checkout@v2
 - uses: bacongobbler/azure-blob-storage-upload@v1.1.1
 with:
 source_dir: 'public'
 container_name: '$web'
 connection_string: CONNECTION_STRING_OMMITED
 sync: true

Please note, I have omitted the connection_string for obvious reasons.

On the Azure side, I have the following configured

  1. Storage account with a Blob Storage container.
  2. CDN EndPoint configured with the Blob Storage as it’s the origin.
  3. A Key vault containing my Domain’s SSL Certificate tied to the above EndPoint.
comments powered by Disqus