New Blog for a New Decade

Getting the Azure I&O blog up and running

Posted by Ryan McDonald on January 01, 2020 · 8 mins read

Inspiration

Throughout my career, I’ve always wanted to give back. I find so much information on the Internet that I use to solve problems and come up with new ideas.

I’m also inspired by colleagues that I work with at 10th Magnitude that have great blogs - Colin Dembovsky, Annie Hedgpeth, and Josh Garverick, just to name a few.

In my work with 10th Magnitude, I spend my time thinking about the management of Azure Infrastructure at scale and building 10th Magnitude’s Azure Managed Services practice. My goal is to share some of the best practices for Azure Infrastructure & Operations that I learn along the way.

So welcome to my first post in 2020!

Blog Goals

In addition to giving back to the technical community, I also have several other goals with the blog, which include:

  • Website source code in Github
  • Site is generated with a Static Site Generator
  • Use the Clean Blog theme from Start Bootstrap

After some research, I decided on a couple of approaches to test:

  • Local development environment with a Static Site Generator, Azure DevOps Pipeline, and the site hosted in Azure
  • GitHub Pages

What is a gem and why aren't they working?

After looking at the popular Static Site Generators, I narrowed it down to Jekyll and Hugo that I wanted to test.

Both Jekyll and Hugo have good “getting started” documentation on their websites. I wanted to get a local environment up and running before tackling the Azure DevOps pipeline. I’m running Windows 10, so I had to dig a little to get the Windows specific instructions.

Hugo

I got Hugo up quickly using Chocolatey from the instructions located on the Hugo website.

Hugo Install

I found a Hugo version of the Clean Blog Theme, but once I got it up and running, it seemed like a few features were missing.

Hugo Success

Jekyll

Blackrock Digital (the creators of Start Bootstrap) had an official Jekyll version of the Clean Blog Theme. The theme looked pretty mature and had been updated recently, so I was excited to get it up and running.

I started with the Jekyll on Windows instructions and was pleased to see that they an option to use the Windows Subsystem for Linux (WSL). This is where everything started to go wrong, and I began to run into problems.

Jekyll Error

I have to be honest, my knowledge of Linux was holding me back as I started to troubleshoot the issue with Jekyll on WSL. I ran back through the instructions a second time to make sure I didn’t miss anything on the instructions but was still getting errors running Jekyll in WSL.

Azure DevOps to the Rescue!

Since I was still having issues with getting a local Jekyll environment up I thought I would work on the Azure DevOps pipeline.

I used this great article by Gunar Peipam to set up the Azure DevOps Pipeline. I did have an issue with the pipeline failing until I found the solution by adding ‘bundle exec’ in front of the Jekyll build command per this Visual Studio Geeks Blog.

Pipeline Yaml

# Ruby
# Package your Ruby project.
# Add steps that install rails, analyze code, save build artifacts, deploy, and more:
# https://docs.microsoft.com/azure/devops/pipelines/languages/ruby

trigger:
- master

pool:
  vmImage: 'ubuntu-latest'

steps:
- task: UseRubyVersion@0
  inputs:
    versionSpec: '>= 2.5'

- script: |
    gem install jekyll bundler
    bundle install --retry=3 --jobs=4
  displayName: 'bundle install'
 
- script: |
    bundle install
    bundle exec jekyll build
  displayName: 'jekyll'
 
- task: CopyFiles@2
  displayName: 'Copy Files to: $(Build.ArtifactStagingDirectory)'
  inputs:
    SourceFolder: '_site'
    TargetFolder: '$(Build.ArtifactStagingDirectory)'

- task: PublishBuildArtifacts@1
  inputs:
    pathtoPublish: '$(Build.ArtifactStagingDirectory)'
    artifactName: site

I configured the release pipeline per the article from Gunar, but used Azure Web App as the destination rather than a storage account.

The release pipeline uses the artifacts from the build stage.

Azure Devops Relase Pipeline

The only issue I had to work through was getting the package folder correct. In my case, it was $(System.DefaultWorkingDirectory)/_rtmcdo.ryanm.com/site

Azure Devops Relase Pipeline

Azure DevOps provides some nice out-of-the-box reporting. The build phase takes approximately 6 minutes, with 61.61% of total run time taken by step - bundle install.

Azure Devops Pipeline Report

To get the local Jekyll environment set up, I installed Jekyll via “Installation via RubyInstaller” which installed Ruby, etc., on my local machine. The installation worked great and to get the local site up and running all you need to do is run bundle exec jekyll serve from the command line.

Local Jekyll Running!

GitHub Pages

If you aren’t familiar with Github Pages, it provides a website hosted directly from your GitHub repository. Just edit, push, and your changes are live. The great thing about GitHub pages is it uses Jekyll on the backend for authoring pages.

To get up and running on Github pages, I did the following:

GitHub Pages

Within a few minutes, I had everything up and running!

GitHub Pages

So I have to admit, GitHub pages won me over. It only took me about 30 minutes to get everything up and running with my custom domain name.

Wrapping Up

As much fun as it was to build the website pipeline with Azure DevOps and to host the site in Azure, the simplicity of GitHub Pages made it the right solution for Azure I&O blog.


Credits:

Photo by Patrick Fore on Unsplash.