はてなブログからhexoにブログを引っ越しました

タイトルの通り、はてなブログからHexo仕立てのブログに引っ越しました。

前々からはてなブログ重いなーと思っていたのと、今までweb周りちゃんと触ってきたことなかったので、ちょっと勉強がてらhexoに移管してみました。

なぜHexoにしたか

なぜHexoにしたかと言うと一番自分の目的である「ブログを自分で作る」に一番合っていそうだったから。

他にもGatsby, Jekyll, HUGO, VuePressあたりが候補にあったのですが、いずれも学習コスト高そう or ブログ作るのには向いていなさそうというのが却下の背景です。

「ブログを自分で作る」にも、色々度合いがありそうですが、まあなんとなく調べた感じ、参考にできそうな記事も多そうだったのもオマケ的にHexoを選択した理由になっています。

立ち上げまでの道のり

ここで立ち上げまでの道のりをおさらい。

事前学習

実はHTMLとかCSSとかほっとんど触ったことなかったので、念の為Progate使ってHTML/CSS周りの入門をしました。入門と言いつつ、面白くなってHTML & CSS, Sass, JQuery, JavaScriptのコースを完走したので、結構ここで時間がかかりました。

ボリュームがありそうに見えますが、結構スイスイと進めるので、初めてみるとあっという間に終われますよ。上記のコースを完了した上で、Hexoを使って既存のテーマをベースに自分好みのブログが立ち上げられました!

Hexoでのブログの立ち上げ

Hexo自体の設定は色々な方がブログなどで説明している通りですが、以下のような流れになります。

  1. Node.js及びnpmの設定 with nodebrew
    1
    2
    3
    4
    5
    $ nodebrew setup                                   
    $ nodebrew install-binary latest
    $ nodebrew list
    v13.12.0
    $ nodebrew use v13.12.0
  2. hexoのinstall
    1
    $ npm install -g hexo
  3. hexoによるblogの立ち上げ
    1
    $ hexo init

私は以下の記事を参考にしながら立ち上げました。

はてなブログの記事の移行

はてなブログからの移行に関しては以下のcliツールを利用させてもらいました。使い方はREADME.mdに記載されている通りなので割愛します。

ただし、上記ツールでエクスポートしただけだと、若干hexoのフォーマットが異なるので、自前でpython scriptを書いて、フォーマットを修正する必要がありました。スクリプトについては余裕があったら後日githubに載っけたいと思います。

ドメイン取得

最初はgithub pagesでも使って運用しようかと思いましたが、せっかくなので自前でドメインを用意しました。使ったのはGoogle Domains。Googleブランドの安心感と、このあと説明するNetlifyでのホスティングと合わせて、その他ブログで運用実績が確認できたので、Google Domainsにしました。

こちらは説明するまでもなく、Google Domainsに行って好きなドメイン名を入れて、末尾を選択するだけ。お値段も年間1000円くらいから購入できるので、良心的ですね。

Netlifyでの運用

ホスティングは巷で話題の(?)Netflifyを使ってみました。Githubと組み合わせることでCI/CDなパイプラインも簡単に作れてしまうので、とっても便利です。

やるべきことはNetlifyのアカウントを作って、Githubと連携して、上記で立ち上げたhexoブログのGithubのrepositoryを指定するだけ。細かい手順などは以下の記事なんかが参考になりました。

あとはNetlifyがrepositoryのソースコード変更に応じて、ブログを更新してくれます。簡単ですね。

まとめ

実際に立ち上げたhexoのブログがこのブログ自身になるわけですが、特にトラブルこともなく、すんなりと自前のブログを立ち上げることができました。フレームワークって偉大だなあ。本当に。

せっかく自分好みのブログを立ち上げられたので、これからもガンガン記事を載せていきたいと思います。

書評「英語喉 50のメソッド」
英語学習記録 2020年3, 4, 5, 6月度