Setting up a blog

A quick overview of how this blog was setup using Hugo and Netlify

Björn Weström

3 minute read

Website

Naturally, to start a blog a website is required. After some reading up from other bloggers I chose to use Hugo. I like to have control over my site and not simply use a pre-made on-line service. Also the possibility to write my content in pure markdown was compelling. Once you have installed Hugo, just pick a theme that suits you and you’re ready to go! I started out with the Hugo Future Imperfect theme. I won’t go into details here since the Hugo site has excellent getting started guides and well managed themes should have brief readme to get you started.

Tweaking the theme

The theme isn’t exactly as you want it? No worries. Just add your own versions of the files you want to replace from the theme. CSS replacements / add-ons go into static/css, and layout replacements go into layouts and subfolders. A no-brainer, since the files from the theme are stored in the same relative directories (look into your theme folder).

Adding non-blog content

You need a page you can refer to but which doesn’t show up as a blog post? I did and could not find a simple explanation of this use case on the Hugo site, so I share it here. Just create a markdown file in one of the content folders (I put mine in the content/aboutfolder since that came with my theme), and only use a bare minimum of header in the file. In Hugo terms this content header is called front matter. This is sufficient front matter for a non-blog page (example from my comment-policy.md file):

+++
title = "Comment policy"
date = "2018-11-18"
+++

The page will be generated by Hugo and can be accessed using the filename as path. So my comment policy is found in https://blog.fractalia.com/about/comment-policy

Source hosting

Since I am used to git, it was natural to use git for hosting the source code for the site. Looking at the obvious candidates, GitHub and GitLab, I found that only GitLab allowed private repositories without a paid subscription. GitLab is a mature site so I just went with that.

Web Hosting

It has been a while since I last set up at website, and I was amazed by the development. I put this site on Netlify, because they offered a very convenient setup. It is hooked into GitLab, so when I push new changes to my site, Netlify pulls the latest version, builds the Hugo site and deploys it. And all this for free without ads - amazing! OK, only non-commercial sites but hey, this is a blog.

Domain name

It is possible to stop here and run your blog. Everything setup so far is free and without ads. But does really romantic-babbage-d6916e.netlify.com look professional enough to you? Not to me!

I decided to register a proper domain name. Today there are tons of top level domains to choose from, but if you want some hipster domain like .ninja you pay a premium ($50 per year!) compared to the old and tried ones. I went with my country specific .se (for Sweden [Swedish flag]) for roughly $12 per year.

HTTPS

As if the automated hosting by Netlify wasn’t enough, as soon as I had registered my domain name in the configuration, a TLS/SSL certificate was generated automatically through Let’s Encrypt, and the site traffic is redirected from http to https. I had planned on doing that myself, but Netlify came through for me again.