🏗️📝 Building A Blog

21 February 2021

💡 Inspiration

In the middle of 2019 I started building this site partly as an educational exercise in what it would take to put this together on my own, host it, build the rails for desktop publishing from my machine and how some of this modern infrastructure works in the backend.

It was also to create a space which I owned, could use to host a basic CV, links to my social presences and ultimately to publish the sorts of posts which I used to host on sites like Medium.

Medium

Why self-built & hosted as opposed to the orders of magnitude alternative of just spooling up a Wordpress? Mainly I’d miss out on the learnings but also… it would feel slighly less “mine”, to do with and experiment on going forward.

A small part of it was also the sentiment Alex Danco expressed in this article - 📝Everything is Amazing, But Nothing is Ours.

Although there are many many dependencies in my stack… it still feels more in my control.

❤️‍🔥 The Real Inspiration

After getting married May 2017, my wife entered the Bride of the Year competition.

Incredibly.. 🎉🎇💃🏾we won!.

Grand Prize? A week in the Seychelles suhn! (DJ Airhorn 📣)

Seychelles

It was on these beaches that the contemplations which led to the blog transpired.

🖥️🖱️ The Tech

I registered the domain siyagule.com, probably with Afrihost but since moved to Namecheap as registrar.

Name Cheap

I decided to try out a great (then new) free hosting service called Netlify. Really easy to use but powerful and flexible; getting it hooked up to my domain was a cinch.

Netlify

Next I needed some actual blogging software.

Again, I decided against trying to host my own Wordpress or whatever and went with a great little website building framework called Hugo, primarly because I wanted a so-called static site, and to learn something new along the way.

Hugo

After coming to grips with installing all the prerequisites and setting the HTML generator up (Hugo uses markdown which you write, to then generate the relevant HTML and Javascript files and structures) - it was time to choose my basic template.

I went with something called Hello Friend NG mainly for the simple and clean aesthetic. I also liked the Nightmode default but… soon changed that.

Template

Honestly, getting it to work was quite a hack, but we got there. This is basically the folder structure that the siyagule site has sitting on my machine.

Hugo Main

I basically create new .md files for each post and plonk them into one of these folders

Hugo Content

Pictures and other static data like PDFs etc, go into this static folder

Hugo Static

I was ready to test it out locally - which involves running a little in-built webserver that Hugo comes with.

Hugo Server

Hugo then uses all your markdown files and renders the raw HTML before serving this locally. After many many false starts… it ran.

Hugo Locahost

It ran!!!

Hugo Website

It was at this time I started using Microsoft Visual Studio code as my main IDE (Integrated Development Environment) - mainly because I was also using this (in Windows-land anyway) to learn Python for another project I’ll probably talk about on these pages in due course.

So the idea of writing the articles in Markdown in VS Code just got me very comfortable with that environment, and used to it’s mechanics.

VS Code

As I was also using this as an exercise to dip a toe into learning more about backend infrastructure more generally, I needed to hook this badboy up to my Netlify host in an automated way so I could publish at the press of a button.

Enter Github.

I registered and hooked my site up as a repo. Remember these files? They were now being pushed to Git.

Github

My initial thought was Windows Command Line hacking around be damned, so I got hold of an application called Git Kraken to manage the link between my PC and Github using a GUI as much as possible. (VS Code also has Git functions but… I’ve also since warmed to command lines due to Raspberry Pi jiggery pokery to be discussed another time).

Anyway… Git Kraken! It also just sounds cool.

Git Kraken

It pushes the files from my PC to Git - and I hooked Git up to Netlify so that whenever I deploy, it automatically starts building the site and publishes it.

Git Netlify

With the site live I of course needed to link some Google Analytics so I can keep track of how many of you lovely readers interact with the words and pictures I publish into what can sometimes feel like the void.

There’s a couple and I’m truly grateful dear reader… thank you.

Analytics Readers

A very modest but slowly growing, geopgraphically diverse readership - some calendar year numbers.

Analytics Countries

We also had to hook up some newsletter functionality for the couple dozen folks who are keen to receive the updates via mailbox. For that I turned to Mailchimp (everything else was too complicated for my noob self) and generated some embedding code which I call up in my post templates.

Chimp

And that, ladies & gentlmen is the stack I used to deliver these to thine eyes. I learned alot putting it all-together and it’s definitely been worth it.

With the heavy lifting done, I can now focus on getting together decent content each week which - luckily for me - tends to arrive via osmosis as I traverse the interwebs for work and play.