Skip to content

Moving away from WordPress to Hugo

This website was initially created with WordPress a long time ago. There have been several template changes over the years and finally, I was able to get everything working when I installed Thesis Theme around 2010.

Even though WordPress was working for me, it was taking a toll on my time when I had to make sure the security aspect of the website is constantly maintained.

Over the past few years, static Webhosting has become popular since the introduction of Amazon S3 / Azure Blog storage hosting. This has addressed one of the main issues I had with WordPress, which is Security. Even though WordPress code is very old, in my opinion, is a great solution for the right problem. However, it is not the right solution for a small blog like this one. I had to constantly make sure that the code and plugins are all up to date and the website is fully secured for any attacks.

I have come across some WordPress static hosting solutions. Even though they did work for me, I was looking for something simple where I could push the code and not worry about any maintenance. I came across Jekyll and while I was exploring about it, then I stumbled upon Hugo.

Hugo

I had to convert my WordPress content to Jekyll and then I had to port them to Hugo. Once the content has been converted, I was able to get the site up and running.

Fnode Theme

I have never liked any readymade theme available for Hugo because I wanted something very specific. Therefore, I have decided to build the theme myself and make it look exactly like the theme I had for WordPress. I did not want to build a theme from scratch, so I was able to fork the theme Inkblotty and built my theme on top of that.

I was able to add a lot of visual changes along with the following addition.

  1. CSS Minification & Fingerprinting
  2. Google Tag Manager (GTM)
  3. Google Adsense
  4. Detailed Pagination
  5. Social Icons

Closed Code

I have decided not to release this theme for the public. The main reason is to keep the unique look of my website.

Architecture

  1. The website content is generated and uploaded to S3 bucket
  2. CloudFront caches the contents of S3 bucket
  3. User requests nish.com
  4. CloudFlare A record matches this request and points to the linked CloudFront distribution
  5. Cloudfront distribution enables a secure connection and serves the cached version of S3 bucket’s content

Tech choices

  1. Static website generator: Hugo
  2. Hosting: Azure Blob Storage
  3. Domain Name Server (DNS): CloudFlare
  4. TLS certificate: Custom Certificate on Azure Key vault
  5. CDN: Azure CDN
  6. Code repository: Github
  7. Comments: Basin
  8. Code Editor: Visual Studio Code

You can see here on why I have chosen to host the Website on Microsoft Azure as opposed to AWS.

Conclusion

Hugo is a great static content generator for someone who is not looking to serve dynamic content via a database backend. While having a database-backed content generator has its advantages, it does have it’s fair share of problems. As I mentioned above, Security is one of the key aspects to consider before choosing a database-backed content management technology.

It all comes down to the requirement and what is good for the end-user. In my case, I can forgo the advantages of a dynamic content generator over static content generator since my requirements are fulfilled by Hugo. However, It might not be the same for others, so such decision needs to be thoroughly analysed before switching to static content generator such as Hugo.

comments powered by Disqus