Hugo is a static file generator. It allows you to write your content in markdown then generates it into a blog or site.

Installation

Since hugo is written in Golang, it compiles to a single binary that can be downloaded from its release page here.

• Head over to hugo release page here
• Click on the latest release and locate the tar file for your machine
• Download the file. Use the following command if using the terminal

1

curl -LO https://github.com/gohugoio/hugo/releases/download/v0.123.6/hugo_0.123.6_Linux-64bit.tar.gz

• Extract the content locally

1
2
3
4
5

$ tar -xzvf hugo_0.123.6_Linux-64bit.tar.gz

x LICENSE
x README.md
x hugo

• Move extracted content to the /usr/local/bin directory.

1

sudo mv hugo /usr/local/bin

• Confirm that the command works as expected by checking the version

1
2
3

➜ hugo version

hugo v0.123.6-92684f9a26838a46d1a81e3c250fef5207bcb735+extended darwin/arm64 BuildDate=2024-02-28T18:29:40Z VendorInfo=brew

Create new site citizix

To create a new site, run the following commands.

1

hugo new site citizix

Switch to the new site and initialize a git repository

1
2

cd citizix
git init

Add a Theme

To add a theme, you need to identify your theme here https://themes.gohugo.io/. I am using the theme noteworthy found in this git repo https://github.com/kimcc/hugo-theme-noteworthy.

Clone the site you like to the themes dir

1

git clone https://github.com/kimcc/hugo-theme-noteworthy.git themes/noteworthy

To update to the new theme real quick, update the config.toml file, add the theme = "noteworthy" line.

Quick command

1

echo 'theme = "noteworthy"' >> config.toml

Customize the Theme

Your new site already looks great, but you will want to tweak it a little before you release it to the public. As a quick start, you can copy the config.toml file in the exampleSite as a start and change the defaults.

Create new blog post

To create a sample page for your blog, use the following command

1

hugo new posts/blog-with-hugo.md

Start server

To run the server and view your site, do this:

1

hugo server -D

Navigate to your new site at http://localhost:1313/.

Feel free to edit or add new content and simply refresh in browser to see changes quickly (You might need to force refresh in webbrowser, something like Ctrl-R usually works).

Build static pages

When you are done adding your content, you would want to build the static pages that will render your site.

Use this command

1

hugo -D

Output will be in ./public/ directory by default (-d/--destination flag to change it, or set publishdir in the config file).

Drafts do not get deployed; once you finish a post, update the header of the post to say draft: false

Conclusion

In this guide we managed to install hugo and create a simple site with it.