Creating my personal site (the one you’re reading right now). I used a static site generator called Hugo. I picked it mainly because I’m already a bit familiar with Go, but the nice thing is you don’t actually need to know Go at all to use it. It’s simple, fast, and gets out of your way. In this post, I just want to walk through how I got started and how I began building my own documentation space.
Getting Started with Hugo
First things first: installation. Hugo has solid documentation that covers different environments, so it’s best to follow their official installation guide depending on your setup.
Once installed, I’d strongly recommend going through their “Getting Started” section. It gives you a clear idea of how everything fits together.
To create a new site, just run:
hugo new site <name>
Hugo immediately gives you helpful next steps, which is a nice touch. After that:
cd <name>
Choosing a Theme
This part honestly took me the longest. There are hundreds of themes available, and picking one isn’t exactly straightforward. I wish there were better filters, but I eventually realized they’re roughly sorted by GitHub stars.
That led me to the PaperMod theme. It checked all the boxes for me: clean, minimal, blog-friendly, and with dark mode support. The documentation also looked solid, which made the decision easier.
If you want to in dept features of PaperMod
To set it up, I initialized a Git repository:
git init
Then added the theme as a submodule:
git submodule add --depth=1 https://github.com/adityatelange/hugo-PaperMod.git themes/PaperMod
Configuring the Site
Hugo uses a configuration file, typically hugo.toml. I switched mine to YAML since I’m more comfortable with it.
Here’s a simple starting point:
baseURL: ""
languageCode: en-us
title: Your Name
theme: PaperMod
Once that’s in place, you can spin up your site locally:
hugo server -D
The -D flag includes draft content, and Hugo’s live reload makes development really smooth. Just keep the server running while you work.
Creating Content
Adding content is straightforward:
hugo new content posts/my-first-post.md
This creates a Markdown file inside the content folder. Hugo also generates some default metadata at the top:
+++
title = 'My First Post'
date = 2023-11-12T22:40:04+02:00
draft = true
+++
You can edit the title and start writing your content right below it. Save the file, and you’ll instantly see it reflected on your local site.
If you prefer YAML over TOML (like I do), you can tweak the archetype template in the archetypes folder.
Adding a Menu
To add a simple navigation menu, update your config file:
menu:
main:
- identifier: posts
name: Posts
url: /posts/
weight: 10
- identifier: tags
name: Tags
url: /tags/
weight: 20
- identifier: search
name: Search
url: /search/
weight: 30
You can also tag your posts by adding something like:
tags: ['tag1', 'tag2']
Then just navigate to the tags page to see them in action.
One small quirk I noticed: sometimes the site doesn’t reload properly. Saving the config file usually fixes it.
Adding Search
The search page doesn’t exist by default, so you’ll need to create it:
hugo new content search.md
Then update its metadata:
---
title: "Search"
layout: "search"
summary: "search"
placeholder: "start typing here ..."
---
Customizing the Homepage
To add a bit of personality to the homepage, you can include an intro and social links:
params:
homeInfoParams:
title: Some fancy text...
Content: This is my personal blog...
socialIcons:
- name: github
url: "https://github.com/username"
- name: linkedin
url: "https://linkedin.com/in/username"
Just swap in your own links and text.
Final Thoughts
At this point, things already start to look pretty good.
What I really like about Hugo is how everything is file-based and content is just Markdown. It keeps things simple and flexible. And if you ever want to tweak something, you can dive into the HTML, CSS, or JavaScript and make it your own.
If you want to go deeper, the documentation is extensive and well-written. There’s a lot you can do once you get comfortable with the basics.