Hugoとは

Hugoは静的サイトジェネレーターと呼ばれ、Markdown形式のコンテンツからHTMLを作成してくれます。
HugoはGoogle製のGo言語で作成されており、サイト作成の速度が非常に高速です。
この記事では、MacOSでの環境構築について説明します。

ローカルでサイト作成

Hugoインストール

Homebrewを使用すると簡単にインストールできます。

$ brew install hugo

無事インストールが完了していると、以下のコマンドでバージョンが表示されるはずです。

$ hugo version
Hugo Static Site Generator v0.79.0/extended darwin/amd64 BuildDate: unknown

新しいサイトの作成

$ hugo new site new_site_name

このコマンドを実行することで、new_site_nameというフォルダー名で新しいサイトが作成できます。

テーマの追加

Hugoはテーマという仕組みで、簡単にサイトのデザインを使用できます。
テーマファイルは、themes/theme_nameディレクトリに保存されます。

git init(gitの初期化)を実行した後に以下を実行します。

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

submodule addはgitのリポジトリ内に、子供のリポジトリを追加するコマンドです。
https://github.com/theNewDynamic/gohugo-theme-ananke.gitで定義されているHugoのテーマファイルを、ローカルのthemes/anankeディレクトリに保存しています。
submoduleとして追加しなくても、ダウンロードしてきたテーマファイルを配置しても構いません。

完了した後theme = "ananke"のようにconfig.tomlファイルに追加することでテーマを使用できます。

投稿の追加

投稿はcontent/<CATEGORY>/<FILE>.<FORMAT>という形式で保存します。

hugo new post/first-post.md

と実行すると、content/post/first-post.mdに投稿んぼ雛形が追加されます。

---
title: "My First Post"
date: 2019-03-26T08:47:11+01:00
draft: true
---

中にはこのような情報が記載されており、記事の詳細情報を定義することができます。

Hugoを起動する

hugo server -D

このコマンドで起動できます。
通常 http://localhost:1313/ にアクセスすると立ち上げたサーバーにアクセスできます。

ビルドする

以下のコマンドでサイトをビルドできます。
初期状態ではpublicディレクトリにサイトが作成されます。

hugo 

参考

QuickStart