Background on blog 3.0

I’ve had an on again off again relationship with writing blogs. On one hand I really like helping people and sharing information, but on the other hand I am not a fan of writing. I started out originally hosting a blog using a static web page and found this okay, and resisted the urge to go to WordPress, but then I did and it worked for a while, but as I feared, I spent more time working on maintaining the database, or fixing nginx rather than writing. Back in June of 2020 I found I had some issue that I didn’t want to fix in WordPress, so thought about shutting everything down and giving it up, but then I figured there had to be a better way(low maintenance and easy), so this is the next iteration of this journey going back to static pages.

Problem

Sharing information should be easy, reliable, and not take a lot of time to maintain. With this charge I decided to adopt a few methodologies:

• store everything in git source control
• choose a flexible framework that allows quick creation of content
• remove the hosting from my management as much as possible
• use existing dns infrastructure if possible

Solution

Recovering Blogs and choosing the Platform

It seems that this journey from WordPress to a different format has actually been very common among technologist I follow and share ideas with, so it was easy to find examples of what others have been doing. A common solution I have been seeing is using jekyll and GitHub pages to host one’s blog. I initially went down this path, but ran into some issues. My WordPress setup had been defunct for a while, so I had the database with the blogs, but no working front end to manage. Knowing this I knew I could probably pull the posts out, and convert them. This is actually the method that jekyll supports. I tried to export the blogs, but ran into issues getting ruby setup and configured to merely export the blog. Since I was trying to keep the effort minimal spending 4 hours trying to figure out compilation errors for the mysql2 gem I started looking for something else. Looking into other frameworks I stumbled upon Hugo (written in Golang) and found that I could host it on the new Azure Static Web Apps, which is very similar to GitHub Pages. This was great as it seems low maintenance, and provides me access to two technologies that I have been wanting to use more. In order to get there then, I still needed to export my blogs. Since the existing setup wasn’t going to work, I decided to setup a local WordPress instance on my laptop to export the blogs using a wordpress plugin for Hugo. Configuring WordPress usually requires PHP, Apache, and MariaDB, as I did not want to get into weeds I went with setting up a temporary WordPress config using Docker. If you are not familiar with containers this is extremely easy as described here (I used most of this example except for adding a local volume for my use of restoring the local db). Once this temporary container stack was setup, I needed to restore my database

docker exec -i e2bbb5797e61 sh -c 'exec mysql -uroot -p"Some_Temp_Docker_Password" < /tmp/backup/wordpress.sql'

and change the internal references in the database to use http://localhost

docker exec -it e2bbb5797e61 sh
mysql -u root -p
USE wordpress;
SELECT * FROM wp_options WHERE option_name = 'home';
SELECT * FROM wp_options WHERE option_name = 'siteurl';
UPDATE wp_options SET option_value = 'http://localhost' WHERE option_name = 'home';
UPDATE wp_options SET option_value = 'http://localhost' WHERE option_name = 'siteurl';

Now that I had my old blog up locally, I installed the plugin by SchumacherFM, and exported the blogs in the Hugo format.

Importing to Hugo + GitHub

By design Hugo is relatively simple to setup and use. All posts are written in Markdown, and stored one-to-one in files under the content/posts folder. Here are the steps I took to get everything setup:

1. Install Hugo
   • I used WSLv2 + Ubuntu to install sudo apt-get install hugo
   • It is not as new as what is on GitHub, but works for me.
2. Create a new Hugo instance
   • hugo new site my-awesome-blog
3. Copy those exported blogs into the content path
   • everything should go in content/posts
   • And images/media from wp-content should go under static/
4. Git init your blog
   • git init
   • git add .
   • git commit -m wooohooo
5. Add a submodule for the theme
   • This reference any github project without including the code directly in your own repo.
   • git submodule add https://github.com/lxndrblz/anatole.git themes/anatole
6. Test out locally if it looks right since Hugo has a local test http server
   • hugo server
   • Browse to localhost:1313

Looking Good!

Once things look right locally then we can push to GitHub and Configure Azure. Setting up an Azure Account is easy, and often comes with a free trial subscription. If not the application we are using is currently free in preview. It was really easy to setup following this guide from Microsoft.

First Push and DNS

Once Azure is configure it will create Github action on your repo to auto build upon any pushes or closed PRs to your branch. In my case this took 2-3 minutes for everything to get setup the first time. The blog will automatically create a https certificate, and bind it to some url like https://<something-something-guid>.azurestaticapps.net If you don’t have a custom domain, you are all set, otherwise you will need to setup (or update) the CNAME for your blog. This Microsoft document did a good job of explaining how to setup DNS and if you are using something like Cloudflare you might read this one about Flattening CNAMES.

Conclusions

So far I am excited about this setup! It has helped me re-engage writing down the puzzles I am solving and sharing them with a wider audience. This method is easy as all of my blogging is done from VSCode, which I already have open for various Open Source projects I work on, and is stored in git, so no fear of loosing a blog, or a record of what I am working on. It also relieves me from thinking about the underlying infrastructure of my blog.