# Hugoを使って爆速でブログを構築した話

- URL: https://sasanokusa.com/blog/hugo%E3%82%92%E4%BD%BF%E3%81%A3%E3%81%A6%E7%88%86%E9%80%9F%E3%81%A7%E3%83%96%E3%83%AD%E3%82%B0%E3%82%92%E6%A7%8B%E7%AF%89%E3%81%97%E3%81%9F%E8%A9%B1/
- 著者: sasanokusa
- 公開日: 2025-06-20
- タグ: hugo, 忘備録
- サイト: sasanokusa（https://sasanokusa.com/llms.txt）

---

忘備録として動かしたいので、時間が経って使い方忘れないように書いておきます。

## 使ったもの(必要なもの)
- 雑に使えるサーバー
- sshとCLIとmdの知識

要らないもの
- フロントエンドの知識
- デザインの知識

## 使い方
サーバーがすでにある前提で行きます。
sshでhugoをインストールします。
私はUbuntuを使っているので、aptを使いたいところですがこれは孔明の罠です。

aptに上がっているのは古いバージョンで、結構使えない機能があるみたいです。
なので公式のgithubから`wget`で直接落としてきてインストールします。
落とすのはextended版の方です。

ここから最新版を落とせます。
アーキテクチャに注意。
[hugoのgitリポジトリ](https://github.com/gohugoio/hugo/releases/)

現在は0.147.8が最新なので、以下のコマンドで落とせます。

```bash
wget https://github.com/gohugoio/hugo/releases/download/v0.147.8/hugo_extended_0.147.8_linux-amd64.deb
```

うちの環境はubuntuかつamd64なので、hugo_extended_0.147.8_linux-amd64.debを落としました。
落としたら解凍して、バイナリを/usr/local/binに移動します。

```bash
sudo dpkg -i hugo_extended_0.147.8_linux-amd64.deb
```

これでhugoの準備はオッケーです。
次に、ブログのディレクトリを作成します。
これは超簡単で、hugoのコマンドでディレクトリまで作成できます。

```bash
hugo new site myblog --format yaml
```
これでmyblogというディレクトリが作成されます。
`--format yaml`はオプションで、YAML形式の設定ファイルを使うためのものです。
hugoの最新バージョンはtomlが標準ですが、PaperModテーマは設定例が全てyamlなので、yaml形式を使います。
もしtoml形式を使いたい場合は、特に何も書かなければそのままtoml形式で作成されます。

次にテーマを選びます。
テーマは[Hugo Themes](https://themes.gohugo.io/)から選ぶことができます。
私は[PaperMod](https://github.com/adityatelange/hugo-PaperMod)を使っています。

```bash
cd myblog
git clone https://github.com/adityatelange/hugo-PaperMod themes/PaperMod --depth=1
```

これでテーマがmyblog/themes/PaperModに追加されます。
PaperModのwikiより、テーマの更新をするときは

```bash
cd themes/PaperMod
git pull
```

で更新できます。
完成されたテーマなのであんま更新は来ないそうです。

記事を作成するときはコマンド一発でいけます。

```bash
hugo new posts/xxxxx.md
```

これでmyblog/content/posts/xxxxx.mdが作成されます。

設定とかはPaperModのDemoページのソースコードが参考になります。

[PaperModのDemoページ](https://github.com/adityatelange/hugo-PaperMod/tree/exampleSite/)

このデモではMarkdownの書き方も指導されているのでお勧めです。

## デプロイ
デプロイはApacheサーバーがもともと用意されているたので、そこにデプロイします。
hugoのコマンドで静的サイトを生成し、それをApacheのドキュメントルートにコピーします。
これをshellスクリプトで自動化しました。

以下のスクリプトを`deploy.sh`という名前で保存します。
このスクリプトは、hugoでサイトをビルドし、生成された静的ファイルをApacheの公開ディレクトリに転送します。
スクリプトを実行する前に、Apacheのドキュメントルートが`/var/www/html/`であることを確認してください。

スクリプトの内容は以下の通りです。

```bash
#!/bin/bash

# スクリプトが置いてあるディレクトリに移動する
cd "$(dirname "$0")"

echo "🚀 ビルドを開始します..."
# Hugoでサイトをビルドする
hugo

echo "🚚 ファイルを公開ディレクトリに転送します..."
# rsyncを使ってpublicディレクトリの中身をApacheの公開ディレクトリにコピーする
rsync -av --delete public/ /var/www/html/

echo "✅ 完了しました！"
```

以上です。