ブログをHexoに移行しました。

移行したきっかけ

元々はてなブログを使っていて、とてもゆるいペースではあるものの記事を書き続けられるようになってきて、画面のカスタマイズをもっとしてみたくなったため、はてなブログProに移行するか検討したところ、はてなブログProの月額で悩んだことでした。

2年契約で月額600円なのですが、今後2年続けられるかという不安が大きく、1ヶ月単位にしようかとも思ったのですが、そうすると月額1,008円になるのでちょっとお高いかな…?という印象を受けて、Proへの移行は踏みとどまりました。

月額600円あったらAWSを使ってサーバーレスでどこまで出来るんだろう、と試してみたい気持ちもあったので、静的サイトジェネレーターに移行してみようと考えました。

Hexoにした理由

Hexoを見つけられたのは、Netlifyが公開しているオープンソースの静的サイトジェネレーターのランキングで上位に入っていたからでした。

ブログのジェネレーターだとJekyllの方がトップ(2018.3.7現在)ではあるのですが、最近は私自身がNode.js等、JavaScriptに触れる機会が多いので、Hexoを選びました。

構成

下記のクラスメソッドさんの記事と同じ構成です。

図にするとこんな感じです。

AWS構成

コード管理はCodeCommitで、masterに変更が加わるとCodePipelineが発火して、CodeBuildでビルド・デプロイを開始するような流れです。

上記の記事内でもある通り、確かにCodeBuildでS3にデプロイするのは違うかなと感じつつ、現状CodeDeployで実現できないようなので、とりあえずCodeBuildでS3へデプロイしています。

移行してみて

自分としては良かった点が多いと感じています。
まとめると下記の通りです。

  • AWSを利用し、はてなブログProの月額より下回ることができた。
  • HexoとCI/CD環境を使うことで、記事の作成・公開がVisual Studio Code(テキストエディタ)で完結できるようになった。
  • 直接記事をMarkdownファイルとして作成できるので、記事のバックアップが取りやすくなった。
  • 画面周りの自由度が高まった。

月額

月額で約$0.75でした。

2月からお試し移行を始めていたので、大体の額ではありますが下記のような内訳になります。

サービス 月額
CloudFront $0.21
CodeBuild $0
CodeCommit $0
CodePipeline $0
Route53 $0.51
S3 $0.030775

CodeBuild

CodeBuildは毎月100分の無料枠があり、2月にビルドに使用したのは40分間だったため、$0でした。

CodeCommit

CodeCommitは最初の5ユーザーまで無料で、私用アカウントは自分しか利用していないため、$0でした。

CodePipeline

CodePipelineは毎月1つ目のパイプラインは無料で、現状私用アカウントでパイプラインを利用しているのはこのブログ用のものしかないため$0でした。

テキストエディタで完結

今までWi-Fiがない環境で記事を書く時は、エディタでMarkdownを書いて、それをブラウザ上のはてなブログのエディタに転記していました。

移行後はエディタで書いたMarkdownを保存、エディタからGitリポジトリへpushするだけで本番環境に反映できるようになりましたので少し手間が減ったかなと思います。

(このブログに関しては完全に1人プロジェクトなので、直接masterへpushしています…😇

まとめ

  • Markdownで記事を書くことに抵抗がない
  • ブログのHTML・CSSを自由にカスタマイズしたい
  • AWSをある程度扱える

というような方であれば、月額のコストを低く実現できるので、Hexoはオススメかなと思います。

移行にあたって、技術面で初めて試したことや知ったことがあったので、今後別途記事として上げる予定です。

B!