Skip to content

My Favorite Static Site Generators - And Where They Shine

There's a lot of selection when it comes to static site generators!

Literal sites, just dedicated to listing them, comparing different ones. You'll find one in pretty much every language.

I actively use Hugo, Zola and Next.js.

Hugo

Great for static sites, I mostly use it to generate a folder with HTML from lots of markdown files. It works great!

This one is something of a legacy choice by now though. It's great, don't get me wrong. My oldest, and most successful site runs on it, and I didn't have any issues!

It's very popular, has active development and a huge community.

The only problem I have with it, is the template language.

It's a Go thing, and I find it to be a bit ugly. Just personal taste. However migrating to another static site generator wouldn't fix enough pain to warrant the... well, also pain of migrating.

If it ain't broke, don't fix it! So Hugo will probably be a steady companion, as it has been. Who knows, maybe I'll warm up to it, or find features which are so great that it will become my favorite.

Zola

It's written in Rust. No wait, come back. Please don't go yet.

Basically, this has become my go-to for new project. It's a bit more obscure, and at the time of writing I suspect that the sitemaps in my projects are a bit on the wonky side.

However, the templating language has a similar syntax to Jinja2, which I'm familiar with from the world of Django and Python and find quite pleasing to the eye.

Static markdown files to a functional, simple website? Check. Being able to tweak templates without getting irritated? Check. Zola is my lazy-page choice.

This site is made with it as well!

However, both Zola and Hugo are currently making room for a new contender:

Next.js

This one surprised me. I've been a Vue-sympathisant for a while now. Something about the way components are written, data is passed and the code felt very pleasing to me! It also worked well with a progressive enhancement workflow.

Where the experience wasn't as smooth, was when I tried the Vue equivalent of Gatsby a few years ago for a somewhat-dynamic site.

The docs left me wondering, and my initial enthusiasm for the ecosystem was dampened.

On the other hand, my experience with Next.js was really smooth. I could get everything done that I wanted to without much struggle, the React way felt reasonable enough, and even quite elegant.

Maybe I would have had a good experience with Nuxt.js as well (the Vue equivalent of Next.js), but working with Next.js was such a good experience that I don't feel compelled to look for a possible alternative. It just works!

Now, for the biggest differences which makes Next.js next-level (hehe) compared to Hugo and Zola.

Components! This comes with React. It's incredibly easy to break any page down into reusable parts. This makes it clean (especially handy when working with TailwindCSS) and maintainable.

Dynamic data sources. Possible with the other ones as well, but if I wanted to created a page from a .json file. (And I did.) Next.js makes it really easy and natural-feeling! No jumping through hoops or getting weirded out by and unconventional datasource. Plug it in, and it works.

Natural interactivity. Once again, because we are using React, it's incredibly easy to upgrade single pages to be closer to a web application than a website. Want to create a data querying interface? No problem. Want to send off data or store state? No problem. When I have a more fancy project than a conventional content site, Next.js will be my tool of choice going forward.

If there are reasons to check out any other one, let me know on Twitter!

In Conclusion

I hope this overview of my currently most-used static site generation options has been useful to you!

Each has their strength and use. I don't think I'd want to miss any of them, and don't regret having them in my toolbelt.

When it's a simple site, I'll use Zola. If it's a more-fancy static site, I'll check if Hugo has the features I need. If it's more interactive or my data comes in a non-markdown format? I'd use Next.js for it any day.

Well, unless it's a CRUD thing. Then I'll be creating a Django project :D The right tool, for the right use case, eh?