89 lines
3.1 KiB
Markdown
89 lines
3.1 KiB
Markdown
---
|
|
title: HUGO Static Site Generator
|
|
date: 2021-12-26
|
|
author: "ahmza"
|
|
draft: false
|
|
weight:
|
|
|
|
tags: ["web dev"]
|
|
description: "HUGO is a static site generator. No idea what that is ? Check out this post to learn more !"
|
|
---
|
|
|
|
## **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.](https://blog.ahmza.com/posts/building-a-docker-swarm-with-pis) 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.
|
|
|
|
{{< video label="i love it" webm="/webm/i-love-it.webm" >}}
|
|
|
|
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](https://blog.ahmza.com/posts/setup-a-hugo-site)
|