ブログをリニューアルしました🎉

以前まではWordPressでやってたけど、普段ブラウザ上であれこれカスタマイズする癖のない自分からすれば、情報量の多さにかえって疲れてしまうことがあり、ほとんどの機能を使い余してしまう状況になってたので「これでいいんだよ」を体現した静的テンプレエンジンに方向転換することを決めました。
・・・と言いつつも本心はマークダウンで書ける&実行速度。それだけ。
速さについては本当に申し分なしで感動すら覚えた。

「速すぎるぜ・・・いつまで経ってもパンが焼きあがらねえほどになッ!!!」

ジョジョに出てたらきっとこんな感じに紹介されていただろう。

ただ環境構築する時にちょくちょく躓いたので今回はその時のメモや個人的感想など。

目次

環境

  • Windows 10
  • WSL2でUbuntu18.04使用
  • テンプレートエンジンはHugo(0.88.1)

はじめにHugoはGo製とのことなのでGo環境が必要とも疑ったのですが、不要みたいです。
なのでそのままhugoをインストールしていこうと試みる。

バージョンの依存解決

$ sudo apt install hugo

これでいけそうな感じはするものの、このままインストールした場合、hugoのバージョンが低い。
デフォルトのまま使うのであればさほど問題ないが、テーマによっては推奨されるバージョンとで互換性がなくなるので、合わせておいた方がよさげな感じです。

ちなみに自分はtranquilpeakを選びました。(Demo)
このテーマだと互換性があるバージョンが0.53.1だったため、上げる必要がありました。

github.com/gohugoio/hugo/releases

なので上のリンクの各バージョンを参考にした上で、該当ファイルをダウンロードした後、aptでインストール。

# 実行した階層にhugo_0.88.1_Linux-64bit.debがダウンロードされる。
$ wget https://github.com/gohugoio/hugo/releases/download/v0.88.1/hugo_0.88.1_Linux-64bit.deb

# ダウンロードしたファイルをaptで追加
$ sudo apt install ./hugo_0.88.1_Linux-64bit.deb

これであっさり環境が整ったので、実際にローカルで使えるようにしていく。

ローカルで立ち上げ

サイトの生成は公式だと

$ hugo new site [プロジェクト名]

これでできるみたいだけどGitlab Pagesで公開したいのでGitlab上からテンプレートで作成し、ローカルに落とす方法でやっていく。

  1. 新しいプロジェクトを作成

  2. テンプレート選択

プロジェクトが作成されたらgit pullする。

hugoのテーマはgitでサブモジュール化する必要があるので以下を実行。

# テーマのGit URL(https://github.com/kakawait/hugo-tranquilpeak-theme.git)から任意のディレクトリ(themes/tranquilpeak)へダウンロード
$ git submodule add https://github.com/kakawait/hugo-tranquilpeak-theme.git themes/tranquilpeak

最後にconfig.tomlを編集する。
気を付けるべきところとしては一旦はbaseURLthemeぐらいかな。

baseURL = "/"
theme = "tranquilpeak"

これでhugo serverしたら確認できるはず。

使ってみた感想としてはフォルダ構成も直感的で何より実行がとにかく早いのがとてもいい。
テンプレエンジンの中でシェアが一番大きいJekyllと比べるとテーマは少ないが、それはあくまで入口の話なのでカスタムするときの独自記法が肌に合ってるかを第一に選ぶ方がよいと思われ。
Macだったら環境構築がもっと簡単なのでなんか切ない🥐

WordPressとの比較

WordPressとの比較はフィールドが異なるので正直蛇足かもしれないが、最後に主観込みで羅列しておきます。

ノンプログラマ(初心者含む)から見た比較

WordPress Hugo
テーマの多さ ×
学習コスト ×
ブラウザだけで完結するか ◎(カスタムしなければ) ×
SEO対策の簡単さ
カスタマイズ性
カスタマイズの簡単さ △(プラグインのみなら〇) ×
お手軽運用サービス ConoHa WING GitLab Pages
↑の料金 1210円/月(3か月契約) 無料

HTML・CSS・JavaScriptにある程度の知見がある人から見た比較(重要)

WordPress Hugo
テーマの多さ ×
学習コスト
ブラウザだけで完結するか ◎(カスタムしないなら) ×
SEO対策の簡単さ
カスタマイズ性
カスタマイズの簡単さ

こう見てもWordPressに軍配が上がりそうではあるものの、テンプレエンジンの強みは操作に慣れた後の手軽さにあります。
WordPressは常にブラウザで操作できる分見た目的には分かりやすいのですが、大量のプラグインをインストールしていることによる不具合、更新時のエラー、その他操作時の不具合など、調べるべき不具合パターンの種類が比較的多く、中には「一度アンインストールして再度インストールしたら解決した」や「他のプラグインは問題なく動作したのでこっちを選んだ」といった原因はつかめないが解決はできる問題もまれにあるように思えます。

比べてHugoなどのテンプレエンジンは、超絶便利な管理画面がないので基本作業はエディターになるものの、構成ファイル自体がそこまで多くないので全てを網羅するにしてもそこまで時間がかからないと思います。

ただあくまでこちらの良さは何をするにも Simple is Best! みたいなところがあるので、「慣れてきたからWordPressで使ってたあの機能を同じように付けたい!」ってなったとしても面倒くさすぎて面倒と考えることも面倒になってくると思います。

結局趣向になってくると思いますが、

  • WebやSEOを一つずつ着実に勉強していきたい
  • デザインはそこそこで良い
  • いろんなことに使える汎用知識をつけたい
  • 極力お金かけたくない

という方はテンプレートエンジンを選ぶ方が後々得られる恩恵が多いんじゃないかなーと思います。
こちらから報告は以上です。

プロフィール画像

ふじわら

よくわからないもので戯れてたら自分のことすらよくわからない人間になってしまいました。

ひっそりYouTubeしてます。