Static site generators aren’t new, but something about the fresh simplicity of Hugo is turning heads. We’re in the early stages of the Gartner Hype Cycle, but expect to see media outlets abuzz with tales of Hugo “making waves” and “disrupting stuff”. Even de facto strongholds like WordPress have begun losing ground to the inexorable spread of the Static Invasion.
But between all the skirmishes, turf wars, and soap-box-soliloquies, how do you know if Hugo is the right match for your site, or if it’s even worth the hype? Here’s what you need to know, reader’s digest style. (from Migrating WordPress to Hugo, Step-by-Step)
Getting giddy for Hugo
There’s a lot to love about Hugo: No back-end database or runtime means a reduced attack surface and improved performance, but that’s typical of most static sites. Ludicrous build speed is the killer feature setting Hugo apart from other static site generators. Written in Go, Hugo builds typical websites in about one second.
So yes, Hugo is worth the hype. If your current site is starting to look like an old brown mare, Hugo is the feisty black war-horse pawing the moonlit mist.
Hugo builds typical websites in about one second.
But hold the reins and hang up your spurs for a minute — Hugo is awesome, but it just might buck you off if you’re not ready. Let’s talk about your content.
“Dynamic” vs “static” content
If you’re building the next amazon.com, then I’m afraid you’re stuck riding the docile brown mare — Hugo isn’t for you. A site like amazon.com is inherently dynamic, meaning constantly changing, data-driven, and variable from one logged-in user to the next. A visitor rightly expects a fully customized shopping experience — customized to them.
Hugo, however, works best with static, or unchanging content. So natural fits for Hugo include portfolios, documentation sites, blogs, and landing pages for an app, product, or movie. These types of sites are all static in nature — they’re infrequently updated, and all visitors see the same content. If that sounds like your site, saddle up! Hugo is for you.
Hugo works best with static, or unchanging content.
But what about “mostly static” sites? I’m talking about sites with blog comments and simple shopping carts.
Blog comments are definitely dynamically generated and data-driven. If comments are important to you, then yes it’s possible, and actually super simple, to add comment functionality to a Hugo site. Just use Disqus. It’s free, though ads supported, and will cost around $9 a month if you want to drop the ads.
If you’re hosting your site using GitHub Pages, a completely free alternative to Disqus is Utterances, which builds comment functionality on top of GitHub’s issue tracker system.
Selling the occasional doodad
Maybe you’re not the next Amazon.com, but you sell the odd artisanal doodad on momandpopshop.com. Can you still use Hugo and reap the benefits of static site goodness?
The short answer: Yes, but weigh the costs, in both money and development time.
The longish answer: It’s possible — and pretty easy — to integrate basic shopping cart functionality into your static site using offerings from Shopify, Stripe, PayPal, and others. All of these payment gateways charge the typical 2.9% + $0.30 per transaction.
Let’s look at two popular examples, Shopify and Stripe.
Shopify is really easy to integrate with Hugo, and arguably produces the best-looking results with minimal effort, but here’s the catch: Shopify charges a minimum $29 per month to use their service, and that’s on top of the 2.9% + $0.30 per transaction. Gulp…
Stripe doesn’t charge a monthly fee to use their API, but all the heavy lifting is on you. You’ll have to figure out how to securely make the API calls, which may involve setting up your own server or figuring out AWS Lambda Functions. As Hugo continues to grow in popularity, expect someone to make this easier.
The writing and editing experience
If you’re accustomed to a polished and sophisticated CMS like WordPress, editing with Hugo may feel like entering the home of an ancient Spartan warrior. Building a Hugo site means working with plain old text files. Once the initial shock passes, however, you’ll likely feel liberated by Hugo’s unadorned simplicity. No buttons or menus to help you out means no buttons and menus to get in your way either. It’s just you and your text, alone and in the zone.
While editing text in Hugo is a minimalist’s dream, image editing presents a special challenge. No Content Management System means you have to edit all your images by hand, perhaps using software like GIMP.
Even as a WordPress customer, I edited all the images for my blog in GIMP anyway, so switching from WordPress to Hugo actually saved me time and clicks by cutting out the middle man. Nowadays I just export my images straight from GIMP to the Hugo folder and I’m done with it.
It’s worth noting that working in plain text doesn’t doom you to a sad life in Notepad. There are fabulous text editors like Visual Studio Code, and plugins to help format and edit your text. On top of that, Hugo comes with a web server that lets you see changes to your copy as it will appear in your site — in realtime.
Working in plain text doesn’t doom you to a sad life in Notepad
If you really miss your CMS, the folks at Netlify have you covered. They built Netlify CMS, which is exactly what it sounds like — content management for your static site. You can even upload and edit your images, just like in your old CMS.
Getting started with Hugo
Well, you’ve looked Hugo in the mouth. She’s well-shod and has a fine set of teeth. In fact, she’s affectionately nuzzling your face and mussing your hair with her friendly snorts. If you’ve read this far it’s time to saddle up and put Hugo through her paces. But where do you start?
Once you’re comfortable with Hugo conceptually, start thinking about migration. Maybe your site numbers among the estimated 172 million sites running WordPress. A quick Google search reveals a number of tools and guides to help get you started. And if you prefer curated video tutorials, this article is based on material from the highly-rated course, Migrate from WordPress to Hugo, Step by Step.
In conclusion, the hype surrounding Hugo is largely well-deserved — provided your use case aligns with Hugo’s static nature. So why not give her a chance? A short trot around the stables, a few smiles, a cool evening coding session… And that distant cloud of dust? Oh, that’s you and Hugo, galloping off into the static sunrise.