Welcome to my redesigned blog! I started this site a few years ago using WordPress. It was the natural choice since I worked for a company built around that ecosystem.
A few weeks ago I decided to move my site away from WordPress. This new site is built using Hugo, which is a big change from WordPress.
Hugo vs WordPress
Hugo is a static site generator (SSG). Similar to WordPress, you have a theme that defines the overall look of your site and content that gets embedded in that layout. Both systems support generating complex content with things like shortcodes and templates.
The main difference between WordPress and Hugo is how and when the rendering of content occurs. In WordPress, your content (posts and pages) is stored in a MySQL database. When a user visits your site, WordPress loads up your theme and page templates, connects to the database for your content, and uses all that to generate the page. Unless you're using some fancy caching, this process happens every time a user visits a page on your site.
With Hugo all the rendering happens once in a build stage. There is no database, so your configuration, theme and content are all stored in different files. When you run Hugo, the files are combined to generate images, CSS, JS and HTML file for each of your pages. When a user visits your site, the server simply returns that static content with no further computation.
The other major difference is the author/admin experience. WordPress comes out of the box with user management, logins and a graphical interface for managing content. Hugo doesn't offer any of that. Instead, you type up your content directly into Markdown or HTML files using your editor of choice.
Why I Decided to Switch
There were several reasons that lead me to make this switch.
Shiny new Toys
Let's face it, most software developers have trouble resisting the latest tech trends. I try to control these urges on more serious projects, but my personal blog is a great place to experiment.
SSGs and JAM stacks are becoming more and more popular for building websites. I've been hearing about them for a while now and am excited to experiment and learn. Here are a couple of relevant Changelog podcasts on the topic:
A Blog is Simple
Generally, the main content of a blog or personal website doesn't change too frequently. Especially considering my track record of a few posts a year, a database-backed CMS feels like overkill.
A More Enjoyable Writing Experience
For the not-so-technically-inclined an editor like WordPress's Gutenberg is great. But I'm a software engineer and I'm very comfortable working in an IDE or plain text editor. I don't really need a fancy editor, and I'm in fact more comfortable writing blog posts in Markdown.
I'm really looking forward to:
- Having my blog posts tracked in a Git repository
- Being able to work on my posts offline
- Writing my posts in Markdown
- Being able to easily modify the HTML of my post if I want to
Security is Hard
I was sad/shocked/embarassed to discover that my blog had been hacked at some point 2 years go. Some malicious code went through all my blog posts and randomly embedded a spam link in each one. I still don't know where that came from, but my guess is that it happened when I was trying out different WordPress themes.
Everytime you install or upgrade a plugin or theme, you're adding new code to your server that could be malicious. I'm sure the WordPress community has people working hard to filter those things out, but I wonder how much malicious code slips through the cracks.
It's also possible that malicious code could slip in with Hugo. However, I feel like the surface for attacks is much smaller.
Note1: This is a really interesting topic that I plan on exploring in more detail later.
Note2: There are two great JSParty episodes that remind me of this problem:
Migrating from WordPress
My blog has less than 20 published posts and about the same number of drafts. I decided to manually migrate my posts over to Hugo for the sake of learning more in the process. There was definitely a learning curve at first. It took time to figure how all the themes and templates fit together.
You can create content in Markdown or HTML format. I decided to use Markdown because it's simpler and will keep the look of my site consistent. For the drafts, I didn't even bother creating Markdown files. I just copied the content to OneNote.
This site is very simple and doesn't have that much content. Nevertheless, I was still impressed by the speed at which Hugo builds everything. This entire site takes about 100ms to generate.
Next Steps
I decided to go ahead and switch over to Hugo before getting everything set up. It has all my blog posts which is the bare minimum. In the coming days/weeks there's still plenty to do:
- Add comment support (probably using Disqus)
- Customize the theme from some of its defaults
- Add an about page
- Add links to Twitter/GitHub/etc. under the site title