Build your website with hugo

This is my very first blog post and why not use that opportunity to tell you how I built this website, right?

So when I planned to set up this website I thought about using something like WordPress, I know and actually like WordPress for its simplicity and many useful plugins. But WordPress also has a major downside, it’s running software meaning it needs to be updated regularly the same is true for its plugins and themes. Now that is typically done automatically but still it is still an issue. On top of that comes user management and so on.

Now when you are working together in a mixed group of technicians and non-it people WordPress is probably a good solution for you. But as I will work myself on this website why not use something else.

After a short research I discovered hugo

What is hugo

hugo is a static website generator, built with go. The basic concept is that you write your posts, static pages and so on as source code, in the case of hugo you can do that with Markdown. After you are done with editing your content you simply compile the site into some static files that can then be served by any web server, pretty convenient, right?

Let’s get started

I personally love to work with git, no matter what project I’m working sooner or later I benefited from the features a git repository offers you, like going back to an earlier version that actually worked ;)

If you want, you can play along.

Before we start you need to install hugo check their guides on how to do that, I installed it from the Manjaro package manager after I saw that the package is up to date but there are many other options.

git init aboutme
cd aboutme

So after initiating our git repo, we need to set up our new hugo site, as I want the page to directly live inside the git repo I run the following.

hugo new site . --force

Without the --force hugo would warn us that the directory is not empty, which is true there is already the hidden .git folder but that’s ok, so we force hugo to create the structure anyway.

Themes

There are a variety of themes available on the themes page choose one that you like. To install it you can simply clone it in the themes directory or add it as submodule, which is much nicer.

git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke

Also you need to add

theme = "ananke"

to your config.toml

First post

To create our first blog post we run

hugo new posts/hello-world.md

Open this file with your favorite editor and write something, keep in mind it’s Markdown.

Save the file and run.

hugo server -D

This will start a development server that builds our website and watches for any changes, automatically rebuilding our website. Simply open http://localhost:1313/ in your browser and enjoy your freshly generated website.

Conclusion

hugo is a nice way to build your website if you like working with cli tools and simple editors. As I just started learning about this tool I might write additional posts about hugo, particularly on how to deploy it to a web server.