Installing Hugo (or anything else) into a Docker Container

I have a little bit of an aversion to installing new software on my computer. Especially if I only want to try something out, something that I won’t use very often, or if I don’t really trust the source. There Docker comes in handy. I usually just spawn up a container, install the software, play around a little, and then throw it away again.

I did the same today when I wanted to try out Hugo. The process looked like this:

1 Setup shared folder

First, we set up a folder that we’ll share with the Docker container. In that way, we can edit files locally on the host computer but also access them within the container. I just call the directory data, but the name doesn’t really matter.

mkdir data

2 Create container

Next, we need to spawn up a new Docker container. I usually use the ubuntu:latest image because I’m quite familiar with Ubuntu.

docker run -v $PWD/data:/home/data -p 1313:1313 -it ubuntu:latest /bin/bash

-v $PWD/data:/home/data: Mounts the local ./data folder of the host system with /home/data within the container.
-p 1313:1313: Port forwarding of port 1313. This is the port that Hugo uses for its built-in test server.
-it … /bin/bash will interactively attach to the bash shell within the container.

3 Install Hugo

There are different ways to install Hugo. I find it the easiest to just download the .deb file and install it. So go on Hugo’s release page and get a copy.

Via the shell, we can install the .deb in the container:

cd /home/data/

# install utils that we'll need:
apt-get update
apt-get install curl git

# download deb file
curl -L https://github.com/gohugoio/hugo/releases/download/v0.91.2/hugo_0.91.2_Linux-64bit.deb -o hugo.deb

# install
apt install ./hugo.deb

# verify that it worked
hugo version

4 Create a site

From now we can just follow the Hugo Quick Start guide:

hugo new site quickstart

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

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

hugo new posts/my-first-post.md

5 Open in browser

We want to see the site in our browser of the host system. Before we can access the site, we need to start Hugo’s built-in web-server inside the container:

hugo server --bind 0.0.0.0 -D

Don’t forget to add --bind 0.0.0.0 here. Otherwise, the server cannot be accessed from the host system, but only from within the Docker container. Open http://localhost:1313/ in your browser on the host system and you should see the Hugo page.

You can now edit files on your host system as well as in the Docker container. When the files are saved, the changes are immediately visible in the browser.

Done.

Restarting the Container

If you exit the container bash and want to start it again later, you first need to know the Container ID or Name. You can find out by running this on the host system:

docker ps -a

The output looks similar to this:

CONTAINER ID        IMAGE               COMMAND                  CREATED             STATUS              PORTS                    NAMES
301335cb1fb8        ubuntu:latest       "/bin/bash"              1 hour ago          Up 1 hour           0.0.0.0:1313->1313/tcp   nice_ellis

To attach to bash again, run:

docker exec -it nice_ellis /bin/bash

nice_ellis is the container name returned by the previous command. You can also use the Container ID instead of the name.

Restart the server:

cd /home/data/quickstart/
hugo server --bind 0.0.0.0 -D

Wrap up

We just installed Hugo in a Docker container and ran the built-in web-server within the container. We can access the server from the browser of the host system and can also edit the source files. Similarly, we can install all kinds of software in containers without needing to “pollute” the host system.

I hope you could get something out of this post and I wish you lot’s of fun creating new containers!