Tag: Code
Awhile back I created a prototype of a blog for a project I was working on.
It’s built in Hugo, and is integrated with Tailwind 4 and Lunr search. It has features such as related posts, author profiles, tags, and implements Hugo’s resource processing on all user uploaded images. This makes it ready for image uploads using a static site CMS such as Pages CMS (my favorite at the moment).
This past year I’ve been spending a lot of time building Hugo sites. A couple of my favorites are the docs site for Buoyant and Linkerd.io. While I wasn’t too involved in the visual design, it’s been very rewarding building out the front-end architecture, coding Go templates, and working with Customer Support to structure the content in a way that’s intuitive and helpful for our customers. My favorite part has been iterating on internal processes so it’s easier for our developers to maintain documentation. The primary Hugo feature they interact with are shortcodes, which provide a way to include elements and functionality in Markdown that are not natively supported.
Recently I’ve created a collection of Hugo shortcodes and render hooks on Github that illustrate various techinques that help when building out a shortcode library. It’s not meant to be an exhaustive list of shortcodes you might need in your Markdown content, rather just a starting point.
These techinques include: validating parameters (button), using a partial within the shortcode so both layout and content can use the component (icon), using conditional content (ifparam), and passing parameters from a child shortcode to the parent for rendering (tabpane). Go check them out!
I’m excited to see an update to The Pragmatic Programmer has been released for its 20th anniversary. This book has had a big impact on my thought processes throughout my career. The principals I learned from it, such as DRY, abstraction, reuse, and organization, are still ingrained in the methods I use to design Minted’s component library.
If you’re just learning Hugo like me, you may want to start with Go’s template documentation. The conditional sytax tripped me up for a minute. If you’re accustomed to writing conditionals like this:
if ($x == $y)
if ($x && $y)
if ($x == $y || $x == $z)
This is how it would look in a Go template:
{{ if eq $x $y }}
{{ if and $x $y }}
{{ if or (eq $x $y) (eq $x $z) }}
In a Go template, eq is a function that you pass arguments to, not a comparison operator like you would use in JavaScript.
Welp, this site has just been switched over to Hugo! There’s still some template cleanup I want to do, but overall it was fairly simple to migrate from Jekyll.