Migrating from Hugo to 11ty
I have used the Hugo static site generator on and off for quite a while. It's always been my goto for some reason, probably because it was the first one I ever really had any exposure to.
The thing is, though, I never really liked Hugo all that much. I used it because it was easy to find examples for and quick to get started with, and I stuck with it because of Stockholm Syndrome I guess.
For some reason, I always found Hugo difficult to do anything that deviated even slightly from the designated path that Hugo determined for you. Sure, if you wanted to you could figure out a way to hack it out but, it was always very difficult and awkward.
There are a couple of big things I always ran into with Hugo:
- There was no way to use the templating in individual pages without first writing the templating out into a shortcode.
- The data file system just never made any sense, I tried to generate a bunch of pages from data files and never got it to work.
- The template/layout system always felt overly contrived and I had a hard time with it, to the point where I gave up doing any customization with it.
- Because everything was Hugo specific vs more common templating languages meant everything I learned was Hugo only, and I couldn't really apply it anywhere else.
- Seriously, I still don't understand Hugo data
So one day after spending a few hours trying to figure out how to generate recipe pages from a JSON file and getting nowhere, I decided to say fuck it and try something else.
I had tried 11ty a while back but didn't really get anywhere with it. I wasn't familiar with the JS pipelines for frontend stuff, so it was pretty overwhelming at first. This time, however, I had spent a while working with them on a different project with Mithril.js so now is probably the time to try again!
I used the 11ty starter template from the 11ty's docs page and started moving over my pages and templates. This whole process took about an evening to get the basic gist of my site up. It was actually super easy, I was still missing a few miscellaneous things (tag pages for blog posts, rss feed, ect.), but within a few hours I had my site totally migrated.
Being able to use a standard JS templating engine like Nunjucks just makes everything so much easier. I no longer spend all my time just trying to figure out how to iterate over a collection of pages; I can just do it. I don't have to waste my time digging through docs trying to understand some (imo) esoteric system that I only use in one specific case, on my website, and can use something I touch at least a few times a week.
That means I can spend more time on implementing things I want to implement rather than just trying to implement them and failing.
At the end of the day they are all tools to use, and you have got to pick a tool that solves the task you are trying to complete. If Hugo works great for you, hey, no reason to change it just for the sake of change. For me, though, that tool is 11ty.