Go言語製のSSG、Hugoを使ってみる

はじめに

みなさん、Hugo使っていますか？

Hugoとは、Go言語で開発されたSSG（Static Site Generator、静的サイトジェネレータ）です。

このJizo GamesというサイトはWordPressで管理・運用されていますが、それとは違った方法でウェブサイトを管理できるSSGというものがあると知り、興味を持っていました。

Hugoをインストールする

英語ではありますが、Hugoの公式サイトを参考にインストールしていきたいと思います。わしは、Windowsを使っていますが、他のOSを使っている場合はこちらのページから自分のOSのガイドを参考にしてください。

Go言語のほかに、以下の二つをインストールしておいたほうがよいみたいです。

• Git
• Dart Sass

ちなみにわしは、間違えてExtented版でないHugoをインストールしてしまいました。Sassを使いたい場合や、Sassを使っているテーマを使いたい場合は、Extended版をインストールするようにしましょう。

コマンドプロンプトで以下のように入力すると、Hugoをインストールできます。簡単ですね。

go install github.com/gohugoio/hugo@latest

以下のように入力し、バージョンが表示されたら、正しくインストールされています。

hugo version

サイトをつくってみる

ここからは、公式のクイックスタートに従いサイトを作ってみようと思います。

今気づきましたが、「Windowsの場合はコマンドプロンプトを使用しないでください」と注意書きがありましたね…

hugo new site jizogames

jizogamesという名前のサイトを作ります。「jizogames」の部分は自分の好きな名前を入れてください。

cd jizogames

作成したディレクトリに移動します。

git init

Gitリポジトリを初期化します。

git submodule add https://github.com/theNewDynamic/gohugo-theme-ananke.git themes/ananke

ここではAnankeというテーマをインストールしています。

ここで、わしは冒頭の注意を読まずにコマンドプロンプトで作業していたので、クイックスタートのとおり「echo “theme = ‘ananke'” >> hugo.toml」を実行してもうまくいきませんでした。

フォルダ内のhugo.tomlというファイルを開き、theme = ‘ananke’と修正しました。

さて、いよいよサーバを起動してみましょう。

hugo server

ここでまた、わしのポカが原因でエラーが出ました。

Extended版ではないHugoではSass/SCSSをコンパイルすることができません。AnankeはSass/SCSSを使っているテーマなのでしょう。そのため、通常のHugoをインストールしてしまったわしは使えないようでした。

あわててHugoのテーマサイトでSass/SCSSを使っていないテーマを探しました（Chat GPT先生が）。

「Terminal」というテーマを（Chat GPT先生が）見つけたので、こちらをインストールしたところ、無事に起動できました。

hugo server

まだなにもコンテンツがありませんが、http://localhost:1313にアクセスすることで、サイトが表示されていることが確認できます。

コンテンツを追加する

コンテンツを追加してみます。

hugo new content content/posts/my-first-post.md

作成されたファイルに、追記していきます。ここらへんは、クイックスタートのとおりです。

+++
date = '2025-03-18T20:00:00+09:00'
draft = true
title = 'My First Post'
+++
## Introduction

This is **bold** text, and this is *emphasized* Text.

Visit the [Hugo](https://gohugo.io) website!

保存したら、以下のコマンドを実行します。

hugo server -D

もう一度、http://localhost:1313にアクセスすると、内容が更新されコンテンツが追加されていることが分かります。

本番環境にアップロードする際は、「draft = false」に書き換えておきましょう。

おわりに

コマンドプロンプトを使うなと書いてあるのに使ってしまったり、Extended版でないHugoをインストールしてしまったり、ゴタゴタしましたがなんとなく使い方はわかったように思います。

まずは文章をきちんと読むところから気をつけていきましょう。「英語だから」は理由になりませんね。わしのミスがみなさんの教訓になれば幸いです。

もう少し勉強して、なにかひとつHugoでウェブサイトを作ってみたいですね。