Hugoを使ってみることにした

おはようございます。 若林(@nqounet)です。

少し時間ができたので、Hugoを使ってサイトを作ってみる(というか移行してみる)ことにしました。

新しいことをやるのは久しぶりな気がします。

とはいえ、ネタとしてはHexoで使っているマークダウンファイルがあるので、それを使います。

メタ情報

記事には中身だけではなく、タイトルや作成日、タグなどの情報が必要です。

マークダウンで書くにしても、こういった情報を書く必要があります。

Hexoでもファイルの最初にメタ情報を書くことができました。

Hugoではこの部分を「Front Matter」と呼ぶみたいです。

行き着くところは大体同じなのか、ここはYAMLで書けるみたいで、プログラムとも相性が良いです。

既に存在している情報はほぼそのまま使えるので便利です。

Hexoと大きく異なっていたのは、dateです。

Hugoでは、dateがISO8601で書けるようで、タイムゾーン情報も残しておけます。

個人的にはこの点だけでも高評価です。最初からHugoにしておけばよかったかも。

解釈しない項目は、無視されるだけで害がないのも良いですね。

コンテンツ

記事は中身が大事です。

記事を何度引っ越ししたか忘れましたが、その時々でフォーマットが少しずつ異なっています。

前回は、WordPressからHexoにインポートしました。

その直近の記事は良いのですが、後からよくみると過去にさかのぼれば全部がHTMLで書いてあったり一部がHTMLだったり、改行がなかったり、良く見てみると実は全然移行がうまく行っていませんでした。

そして、今回、Hugoでは、HTMLで書かれている部分は、ほぼ無視されている感じでした。 特に2000年の記事は、中身がソースコードだけのような状態になっています。

良く考えると、20年以上前に書いた記事をまだ置いておくか?という気もします。改めて読んでみると中々に赤面するような記事やコードですが。

今回の移行でエラーになったのは、Shortcodeとして見做された部分でした。

Hexoの時もそうですが、記事に使える便利機能が、ソースコードを書くときには邪魔な感じです。

とりあえず、思っていたよりは簡単に移行できました。

途中で一部書き直したりしましたが、中途半端にやったことで後から手間が増えてきたことに気づいたので、一旦白紙に戻し、エラーの部分だけを直しました。

見えない部分の修正はこれから、というところです。

デプロイ

最近の機能なのかもしれませんが、Githubでホスティングするときは、リポジトリのgh-pagesブランチだけではなく、任意のブランチを指定することができるようです。

さらに、ルートディレクトリではなく、docsディレクトリを指定することもできるようです。

Hugoは、通常はpublicディレクトリにファイルを生成しますが、生成先を変更することができるので、docsに指定しました。

あとは、生成したファイルもリポジトリに追加して、pushすればそのまま公開できます。

カスタムドメインの指定は、staticCNAMEを作成すればよいだけでした。(元々カスタムドメインを指定していたためで、最初からやる場合はそれなりの手間はかかります)

最後にfaviconを忘れていたことに気づいて、たまたまですが、選んだテーマがfavicon.pngに対応していたので、同じくstaticディレクトリにファイルをコピーしました。

まとめ

実質的な作業量は半日くらいでしたが、その半分近くは記事の修正に失敗した時間なので、思っていたよりは簡単でした。

特にデプロイ方法が、docsディレクトリに生成すれば良いだけになっていたのはとても便利です。

公開するファイルも同じリポジトリで管理する、というところに今後どう感じるかわかりませんが、今の時点では、脳内で切り離されているので差分も気になりません。

少なくともコミットは分けるべきでしょうね。

参考になる資料

Comments

comments powered by Disqus