Skip to main content
  1. Posts/

HUGO Static Site Generator

·496 words·3 mins·
Web Dev
ahmza
Author
ahmza
Table of Contents

Introduction
#

HUGO is a static site generator, which basically means it’s a tool that allows us to pre-compile all of our website into static HTML, CSS and JS. The main benefit of using such methods to crate a static site is speed. A Static site takes a lot less time to load than a site that uses databases for example.

Disadvantages
#

Some of the disadvantages (for me):

  • A lot more infrastructure setup (for my setup)
  • Editing and creating content can be a pain

This is to no fault of HUGO itself but the complexity of my infrastructure!! Deploying the site in my environment was a challenge as I had to get the site files from gitlab and build a docker image that would compile the site as well as create an image to be deployed in my docker swarm. I do feel I made this more complicated than it needed to be, but now that I have it working the workflow is great.

Because there is no integrated webui or CMS for HUGO, the experience you get when creating content will vary person to person depending on the environment you use to create the content. When using a CMS I took dragging and dropping images for granted where now I have to explicitly define full paths to images which can get me out of the flow of writing content. Finding solutions for these challenges that makes this interesting.

Then Why?
#

The main reason for switching to a static site generator is speed and how lightweight the final product is, at the time of writing this the total size of the content on this site including images is ~5mb which is considerably smaller than a full CMS and database alone with no content.

Some advantages of static sites in general:

  • Security
  • Reliability
  • Scalability
  • Low Resource Requirement

Although the pursuit of speed brought me to HUGO, here are a few other great reasons:

  • Git
  • Markdown
  • Simplicity
  • Live Preview

I have recently started to use git a lot more and I’m able to implement a content versioning system that can follow me everywhere.

Markdown is quick, gives me what I need and doesn’t require me to right click.

HUGO allows you to import pre-made themes or if your feeling up to it, make your own.

Although at the start HUGO seemed difficult to me I managed to learn and appreciate the simplicity it brings to the table. My workflow is not perfect but I feel HUGO makes it easy to develop a smooth workflow.

Live Preview allows you to start up a light weight web server locally and has an auto refresh feature so whenever a change is made the web page refreshes so you can see changes without manually refreshing.

Conclusion
#

You’ve had a quick intro to HUGO and why I choose to use it, I wrote another post on setting up a HUGO site from start to finish.

Setting Up a HUGO Site