Getting Started With Hugo

Introduction Link to heading

I guess every Hugo based technical blog has a mandatory first post on the topic of getting started with Hugo. This is gonna be a short one… because so far, Hugo has been entirely straight forward to use. Took me about 20 minutes to get this working.

Why Another Blog, Dude Link to heading

First of all, my pronouns are “them/they” or “he/him/brah”. And second, because while I’ve done CI for Hugo before, I had forgotten how. I spent about an hour talking the ear off Chris about how cool AWS static content delivery was. And how I could blast together something in the also-very-cool aws-cdk in like an hour for his Hugo sites. Then life happened and… I was a bad friend.

I got back around to it because I was writing similar code for work. I figured that adding the CodeBuild part of it would be pretty straight forward. But like any decent developer, I’m kinda lazy so I googled it first. The AWS blog post sucked, because, in a word, CodePipeline. Really? You’re only going to build the master branch? What about CI and a staging site for PRs?

Having confirmed that this is actually a problem that isn’t already well solved, I started writing hugo-cdk. The idea is simple: deploy a pair of websites, one production, and the other staging. Then deploy an AWS CodeBuild to watch a GitHub repo. Build PRs and publish them to the staging site. Build changes to master and publish them to the production site.

In order to develop the CI, I needed… a Hugo project. Apparently, I’m vain enough to think someone might read this. There, I said it.

HowTo Link to heading

Getting Hugo running was an absurdly easy process. I’ll just drop the code on you.

SITENAME=blog
brew install hugo
hugo new site "$SITENAME"
cd "$SITENAME"
git init
git add .
git commit -m "hugo new site"

I picked the first theme from googling hugo code theme. If you wanted design, ask my wife, not me. I find it reassuring that it is named “hugo-coder”.

git submodule add https://github.com/luizdepra/hugo-coder.git themes/hugo-coder
git add . && git commit -m "git submodule add https://github.com/luizdepra/hugo-coder.git themes/hugo-coder"
cp themes/hugo-coder/exampleSite/config.toml .
# Hack the config.toml into something reasonablish.
# You can use whatever editor you like, as long as it's vscode.
code .
# Make sure I didn't screw it up.
hugo -v
git add config.toml && git commit -m "update config.toml"

Ok next stop, browse around the exampleSite a little more and poach the about.md and contact.md. Personalize it a little. I then removed all the Portuguese language stuff… because I don’t speak a word of Portuguese. Add this post. Ok, it’s a blog. Next post will be about doing stuff with CDK.