このブログの構成

Mon, 05 Jan 2026 00:00:00 +0000

このブログの技術構成についてまとめる。

概要

Obsidian (執筆)
↓
Hugo (ビルド)
↓
GitHub Actions (CI/CD)
↓
Cloudflare Pages (ホスティング)

インフラ管理にはTerraformを使用している。

静的サイトジェネレーター: Hugo

静的サイトジェネレーターとして Hugo を採用した。

選定理由:

Go製のシングルバイナリで依存関係が少ない
テーマが豊富

テーマは hugo-blog-awesome を使用。ミニマルでかっこいい、ダークモード対応。

記事管理: Obsidian

記事の執筆・管理には Obsidian を使用している。

content/posts ディレクトリをObsidian Vaultとして開くことで、Markdownエディタとして活用できる。Obsidianの利点:

Markdownのプレビューがリアルタイム
内部リンクやバックリンクで記事間の関連を把握できる
プラグインで機能拡張可能

記事のディレクトリ構成

各記事は独立したディレクトリとして管理する。

content/posts/
├── .obsidian/ # Obsidian設定
├── 2026-01-05/
│ ├── index.md # 記事本体
│ └── image.png # 記事に使う画像
└── 2026-01-06/
└── index.md

簡素だがこのようなMakefileを用意した

1
2
3
4
5
6


post: ## Create new post (usage: make post)
 @if [ -z "$(TITLE)" ]; then echo "Usage: make post"; exit 1; fi
 @DIR="content/posts/$$(date +%Y-%m-%d)"; \
 mkdir -p "$$DIR"; \
 hugo new "posts/$$(date +%Y-%m-%d)/index.md"; \
 echo "Created: $$DIR/index.md"

この構成により:

Terraform on Blog

このブログの構成

概要

静的サイトジェネレーター: Hugo

記事管理: Obsidian

記事のディレクトリ構成