Setting Up a Hugo Site
For the last few weeks, I have been trying to create a blog that serves as a documentation for different projects that I usually build while learning new technologies.
Normally, when starting a new blog or updating an existing one, “traditional” Content Management Systems or SaaS solutions are recommended because of how quickly you can spin up your site and deploy it to your audience.
While that’s good in terms of speed of getting something out there, it can also come with some cons that you might miss when choosing which medium to use while writing your blogs.
For CMS like WordPress, for example, according to Wiz in 2025 there were about 4,365 vulnerabilities (CRITICAL & High) found in WordPress and/or some of its plugins.
Since I didn’t want to set up a Wordpress site or use a complete SaaS solution where I only have to worry about writing, I chose to build my blog using Hugo so that I can challenge myself on writing but as well as developing a platform where I would be publishing my posts.
Other reasons why I chose to go with Hugo were:
- Hugo uses Markdown
- Easy to deploy across multiple cloud providers or on your own VPS.
- Learning opportunity
Installing Hugo
You can install Hugo from your distro package manager:
sudo apt install hugo # Debian-based
sudo dnf install hugo # Fedora
sudo zypper install hugo # OpenSUSE
sudo snap install hugo # Snap
brew install hugo # Brew
If you prefer building from source, feel free to follow the official documentation on how to build from source as well as required dependencies.
Creating a hugo site
Before creating a new site, you can verify whether hugo was installed by running:
hugo version
If above command returns you current hugo version, then you can proceed with creating a new site.
hugo new site <site-name>
Replace <
site-name> with your project directory name.If you wish to initialize a hugo site in an existing directory, you can run the same command but with current directory path:
hugo new site .
Adding a theme
After creating your site, you will need to add a theme to your project. This can be achieved by importing an existing theme, or creating a brand new.
While creating my blog, I created my own theme from scratch but that’s out of scope for this post. However I would like to create another post in the future on how to create a Hugo theme from scratch Stay tuned ;)
To import an existing theme, you can browse Hugo themes website and choose whatever catches your eye.
For this post I will use paper theme.
As hugo module (Recommended)
First initialize your site as a hugo module.
hugo mod init github.com/yourname/your-site
Installing a theme using Hugo mod cmd.
hugo mod get github.com/owner/theme
In your config file (hugo.toml), remove the theme = '' and Add below section:
[module]
[[module.imports]]
path = "github.com/nanxiaobei/hugo-paper"
Replace the url with the theme you chose.
As a git submodule
Make sure you have initialized a new git repo in your site working dir.
cd <site-name>
git submodule add https://github.com/owner/theme
After adding your submodule, you can append below line to your hugo config file (hugo.toml):
theme = 'paper'
Adding a new page:
After the setup is completed, you will want to create new posts on your site. Below are useful while developing your hugo site.
To create a new page, you can run:
hugo new content content/posts/hello-world.md
Running hugo server
To live display your site, run:
# Running Hugo development server (live-reload)
hugo server -D --noHTTPCache
-D: Tells Hugo to include draft files.--noHTTPCache: Prevents HTTP caching in your browser, which can be problematic especially on CSS files.