Selfhosting my blog with Hugo

At the beginning, there was WordPress

I’ve become sick of using Wordpress for hosting my blog. Yes, it was fantastic to “plug and play” a CMS/Personal blog with a multitude of plugins and a decent WYSIWYG editor. However the constant brute force attempts against the administrative pages along with the inevitable next vulnerability (whether its from a plugin, WordPress itself, or PHP) finally made me sit down and rethink how I wanted to host my blog on the internet. I wanted something simple and secure, so some of these fancy new static site generators caught my eye, specifically hugo.

Static Site Generators

Static site generators are pretty slick. They take your posts (most of the time in the form of separate markdown files) and any theme you have installed and spit out static HTML pages that can be hosted anywhere. The benefits of the sites being static means you can cache them on CDNs, they’re much faster since you aren’t loading dynamic content, and with no admin interface the attack vector against your site is ridiculously smaller compared to a standard WordPress/Drupal installation. That being said, these static sites also have their downsides. Features such as comments, search, slideshows, etc. are not possible natively. There are ways to get those features, but it involves offloading those functionalities to 3rd parties and essentially embed iframes into your static sites. There is also no administrative area to write posts on the fly or change things around, which isn’t necessarily terrible. For instance as long as I am able to git push to my repository, I can write/update posts on the fly.

Hugo

I chose Hugo out of all of them for the following reasons:

  • Its fast, both at compiling the HTML and serving it
  • It compiles and acts as a webserver all in one binary (golang FTW!)
  • It is one of the more popular ones, which means a wide variety of themes
  • Automatically generated RSS feeds - not something critical, but nice to have
  • First class support for Google Analytics and Disqus - not my thing, but nice to have as well
  • First class support for syntax highlighting

Migrating

Now that I figured out what I want to migrate to, the hard part was how to migrate it. The last thing I wanted to do was copy and paste all my work. It turns out that Hugo has a very extensive list of ways to migrate from other CMS/blog software, with a few being specifically for WordPress. The migration was simple enough, I exported my WordPress installation to XML and converted it to markdown using exitwp-for-hugo. I had to clean up a little bit due to some of the plugins I was using, but the process was extremely painless. After polishing everything up, I committed the markdown files to a git repository for future use with Hugo.

Setting up a workflow

The next step was setting up a workflow for regenerating my site and “posting” new content. I’ve become very engrossed in using docker containers to host all my services, so naturally I wanted to host my website in a docker container. This would allow me to maintain portability and scalability. The process ended up being as follows:

  1. Docker container spins up
  2. Runs git clone against my git repository that contains my website “source code”
  3. Compiles the code using Hugo
  4. Host a webserver serving the static HTML generated from step #3

The above process allows me to updated/publish new content freely without worrying about it going live ASAP. As far as actually publishing new content, I can either restart the docker container or let it restart on it’s own (~1 week automatic restart/update). I could also setup some sort of webhook to restart the container whenever I commit to master in the git repository, but that’s probably going to be for another day.