Josh Habdas

Tired of reinventing the wheel? So am I. In the fashion of Awesome React Boilerplateshabd.as is comin’ atcha with an all new evergreen list of awesome boilerplates—this time for the one and only Hugo static site generator.

Let us not waste any more time. Here they are in all their glory! And as always, feel free to drop your submissions in the comment section below to promote your FOSS product for the benefit of others.

AtlasI learned about Atlas from a well-timed comment from @chrisgeary92 while having a short discussion about pulling Gulp from Victor Hugo. Like Victor Atlas is heavily integrated with Netlify so it probably won’t get you very far with a headless CMS like Prismic or Dato. But what you lose in portability you gain in speed to market. Plus it comes with a slick logo, shown here:

Victor HugoCreated by the team at Netlify, Victor Hugo is probably the most popular boilerplate for Hugo projects to date. It comes with a Gulp build pipeline and melds it together with Webpack. While I’m not sure Netlify is dogfooding this internally, I believe they created this when they took Smashing Magazine off WordPress—however a ridiculous choice that actually was. Just remember, sometimes you need to take two steps back to take a step forward. Cool logo not included.

Hugo LambdaWhilst it isn’t actively maintained, the concept behind this boilerplate is sensational—to leverage FaaS tech from Amazon to deploy Hugo under a serverless architecture. If and when I decide to automate deployments with Hugo this is probably the approach I will take. But for now I simply run a single task to deploy from the CLI.

WTF is Serverless you ask?

Learn more about Serverless architectures in my freeServerless crash course, where you'll learn just WTF Serverless is, why it's important and have a chance to use Serverless, Lambda and Node to create your own email forwarding service.

HugulpHugo + Gulp starter kit. Includes BrowserSync, does image optimization stuff, asset fingerprinting (total overkill IMHO when you can simply deploy from AWS), your choice between Less and SASS, autoprefixer and more. What’s really interesting about this kit is it’s inclusion of Docker—probably my favorite DevOps tool ever next to DevilBox or Helm.

HuggleHuggle is a generator and a reduced boilerplate mixed into a single tool. Shown here, Huggle churning out a GitHub Pages-friendly Hugo site with a single command from the CLI:

Web Starter HugoThis engineering marvel has been around almost as long as Hugo itself but doesn’t get much attention. Created by @adrinux Web Starter Hugo bases itself off the one and only HTML5 Boilerplate and includes goodies such as a Gulp build pipeline for responsive image generation, PostCSS and an extensible build of Modernizer. Holy moly that’s awesome!!

Brunch With HugoAre tools like Webpack starting to feel like your Achilles’ heel? Then this is the boilerplate for you. Created by my man main @Jayphen and leveraging the deceptively simple and ultra fast Brunch by Paul Miller and friends, BWH provides BrowserSync and plugs right in with the entire Brunch ecosystem to help you get to where you’re going without dealing with tooling trivialities.

After DarkNo awesome list would be complete if I didn’t selfishly promote some of of my own stuff amirite!? I built after Dark specifically to create my Hack Cabin website. It uses a design concept I call Deceptive Simplicity and introduces cutting edge Web tech without going overboard on tooling. Check out After Dark for a wild trip back in time, when Geocities and Angelfire reined supreme.

Tranquil PeakWait, can Hugo themes also be boilerplates??? You bet they can! And this one from first-time Java dev turned Web dude introduces a sophisticated and highly extensible theme and build toolkit all roped into one. Check out the demo site then click the title link above to dig into the source code.

Find or build something awesome and wanna gush about it? As well you should. And you can do so in the comment section just 👇🏼 below. And when you’re all settled and looking for some inspiration on shiny toys to add to your site check out the full list of JAMStack Frameworks, Tools and Tips.