hugo を使って爆速でブログ・サイトを作る

目次

新たに記事投稿型の webサイトを構築しようと思い、hexoでも良かったんですが、せっかくなら使ったことのないFrameworkを使いたいと思い、今回は、多言語対応にも強い、GO言語で書かれたhugoを使ってみることにしました。
その際の構築手順をメモっておきます。



hugoインスコ

homebrew で入れる。

brew install hugo

サイト作成

作業dirで次のコマンドで作成します

hugo new site ~/○○○○○

結構時間かかる

テーマの追加

cd ○○○○○
git init;\
git submodule add https://github.com/budparr/gohugo-theme-ananke.git themes/ananke;\

設定ファイルにテーマを記述

echo 'theme = "ananke"' >> config.toml

記事作成

下記コマンドで記事を作成

hugo new posts/my-first-post.md

posts って部分は、contents以下のdir名になるので、なんでもOKです

作成された記事のファイルは下記

content/posts/my-first-post.md

このファイルをマークダウン形式で記述します。

ローカルで確認

hugo server -D
-D オプションは、ドラフト(下書き)記事もビルドするという意味

ドラフト機能

これは、Defaultで、下記ファイルの生成されるもとのファイルにて

archetypes/default.md
draft: true

この記述により、この記事はドラフトです。という内容になります。 その場合、ビルドした際、htmlファイルは生成されません。

ドラフト記事も含めてビルドする際(あんまり考えれらない)は、-D(–buildDrafts)コマンドを使うとhtmlファイルが生成されますが、 通常、記事中の、draft: falseに変更するのがいいと思います。

hugo undraft ○○○○

のundraftコマンドはなくなりました。

またドラフト中の記事の一覧を確認するには、

hugo list drafts

で確認できます。

http://localhost:1313/

で確認できます。

多言語対応

hugo は多言語対応に大変優れていますね。 とりあえず、日本語と英語を作成してみます。下記ファイルで設定を行います。

~/config.toml

DefaultContentLanguage = "en"
DefaultContentLanguageInSubdir = true
.
.
.

[Languages]
  [Languages.en]
    weight = 1

    title = "○○○"

  [Languages.ja]
    weight = 2

    title = "○○○"

英語版

example.com/en/...

日本語版

example.com/ja/...

という感じです。 * [Languages]では、それぞれのタイトルや言語ごとの必要事項を設定しておきます。使用するテーマなどに依存します。 * weightは優先する方を低い数値にしておきます。いらないかも。

それぞれの記事を作成

ここでは、英語優先なので、
hugo new posts/sample.md

と、すると英語ページ

hugo new posts/sample.ja.md
で日本語ページとして読んでくれます。

/ja/へのアクセスで、xxxx.ja.md の記事が読まれ、/en/ もしくは / で、xxxx.md or xxxx.en.md の記事が読み込まれ勝手に切り替えてくれます。 あとはそれぞれの言語で記事を書くだけです。

公開

generateします

$ hugo

これだけです。そうするとpublic以下に生成されます。 これらをs3やgithubに上げればOKです。

hugoまとめ

非常にささっと簡単にwebサイトができました。またthemesもかなりたくさんありますが、それをoverride的な形でカスタマイズすることも可能です。 簡単な上に非常に柔軟性があり、hexoよりもいいかもしれません。

U-chan ( Nobuyuki Ukai )

学生時代は建築やデザインを専攻していたが、Yahoo!Japanにエンジニアとして運良く入社し、2年半で波情報を配信する波伝説に転職。3年後、Yahoo!時代の先輩の立ち上げたベンチャーに転職。数年後、伊豆下田に移住し、ゲストハウスを開業しながらリモートでエンジニアを続けたが、焼肉店の開業とともに株式会社UKAIを立ち上げ、法人成り。その後、カフェとゲストハウスをもう一軒開業し、現在は焼肉店、カフェ、ゲストハウス2件目を運営。今季は自社Webサイトの立ち上げ予定!

comments powered by Disqus