はじめに

「知識をストックする場所が欲しい」と思い立ち、Docker と Hugo を使って静的ブログを構築してみました。

Hugo は Go 製の静的サイトジェネレータで、とにかくビルドが速く、Docker での運用も簡単です。

この記事では、環境構築から記事作成、更新までの流れをまとめます。

docker-compose.yml

まずは docker-compose.yml を用意します。

Hugo でビルドして生成した静的ファイルを Nginx で配信する構成です。

services:
  hugo:
    image: klakegg/hugo:ext-alpine # Hugoビルド用イメージ
    container_name: hugo-builder
    volumes:
      - ./site:/src
    working_dir: /src
    command: ["hugo", "--minify"]

  knowledge-blog:
    image: nginx:alpine
    container_name: knowledge-blog
    restart: always
    ports:
      - "80:80" # ← 直接ホストの80番ポートを公開
    volumes:
      - ./site/public:/usr/share/nginx/html:ro

config.toml

サイト設定は以下の通り。 テーマは hugo_theme_robust を使いました。

baseURL = "https://knowledge.sho-kun.com/"
languageCode = "ja"
title = "sho-kun.com"
theme = "hugo_theme_robust"

[services]
  [services.disqus]
    shortname = ""     # コメントを入れる場合は設定
  [services.googleAnalytics]
    id = ""            # GAを使う場合はIDを設定

[params]
  description = ""
  dateformat = "2006-01-02"
  googlefonts = "https://fonts.googleapis.com/css?family=Lato:400,700"
  fontfamily = "Lato,YuGothic,'Hiragino Kaku Gothic Pro',Meiryo,sans-serif"
  logofontfamily = "Lato, cursive"

  [params.author]
    name = "sho-kun"
    thumbnail = "images/author.jpg"
    description = "<p>takahashi sho</p>"

[outputs]
  page = ["HTML", "AMP"]

記事作成用スクリプト（newpost.sh）

記事を簡単に追加できるようにスクリプトを用意しました。

Markdown テンプレートが自動で生成されます。

#!/bin/bash
# 使い方: ./newpost.sh 記事タイトル

if [ -z "$1" ]; then
  echo "記事タイトルを指定してください"
  exit 1
fi

POST_NAME=$1
SITE_DIR="/opt/docker/knowledge/site"
POST_FILE="${SITE_DIR}/content/posts/${POST_NAME}.md"

if [ -f "$POST_FILE" ]; then
  echo "⚠️ すでに記事があります: $POST_FILE"
  exit 1
fi

mkdir -p "${SITE_DIR}/content/posts"

cat <<EOF > "$POST_FILE"
---
title: "${POST_NAME}"
date: $(date +"%Y-%m-%dT%H:%M:%S%:z")
draft: false
tags: ["knowledge"]
---

## はじめに

この記事では **${POST_NAME}** について解説します。

---

## ポイント

- 知識を整理
- 例を紹介
- コマンドを記録

---

## サンプルコード

\`\`\`bash
echo "Hello Knowledge"
\`\`\`

---

## まとめ

この記事のまとめをここに書きます。
EOF

echo "✅ 新しい記事を作成しました: $POST_FILE"

更新用スクリプト（reload.sh）

記事を書いたら以下のスクリプトでビルド＆Nginx 再起動。

すぐに knowledge.sho-kun.com に反映されます。

#!/bin/bash
SITE_DIR="/opt/docker/knowledge/site"

echo "Hugoでビルド中..."
docker run --rm -v ${SITE_DIR}:/src klakegg/hugo:ext-alpine

echo "Nginxを再起動..."
docker compose -f /opt/docker/knowledge/docker-compose.yml restart knowledge-blog

echo "✅ サイトが更新されました: https://knowledge.sho-kun.com"