/ I built my blog using with Hugo 😉

Updated at 03/05/2025

Motivation

I’d like to publish my blog on my persoanl server.

Requirements

• VPS as a server
• Portainer to manage container
• Hugo to generate static site

Table of contents

1. Preparation

2. Add new stack to Portainer

3. Add style to hugo

4. Add new content

5. Access the page

1. Preparation

I cound’t start new container for Hugo from Portainer, so I had to create a directory then install Hugo in my VPS server.

I install git,too.

$ mkdir home/ubuntu/hugo/data
$ cd mkdir home/ubuntu/hugo/data

~/hugo/data$ sudo apt update
~/hugo/data$ sudo apt install hugo git

Then typed command

~/hugo/data$ hugo new site .

2. Add new stack to Portainer

services:
   hugo:
     image: hugomods/hugo:latest
     container_name: hugo-blog
     volumes:
       - /home/ubuntu/hugo/data/:/src
     command: server -b <IP address of my vps> -D
     ports:
       - 1313:1313
     working_dir: /src

Let’s take a closer look at the command: server -b <IP address of my vps> -D.

• server: Starts the Hugo development server.
• -b <IP address of my vps>: -b is short for --baseURL, which sets the base URL for the site.
• -D is short for --buildDrafts; it includes draft content in the build.

This command launches Hugo’s development server and builds the site-including draft posts-using the specified base URL.

3. Add style to Hugo

In VPS /home/ubuntu/hugo/data/ type command below,

~/hugo/data$ git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/<style-name>
~/hugo/data$ echo 'theme = "<style-name>"' >> hugo.toml 

4. Add new contents

Create contens

~/hugo/data$ hugo new content content/posts/my-first-post.md

Edit content and meta-data draft = false

~/hugo/data$ nano /home/ubuntu/hugo/data/content/posts/my-first-post.md

5. Publish contents

To generate the static site, run the following command in the root directory of Hugo project:

hugo

or

sudo hugo

6. Access the page

<protocol><your IP address>:1313/posts/my-first-post/