AWS Amplify から microCMS に変更した話 - キカガクプラットフォームブログ

📝 この記事で学べること

ヘッドレス CMS のように使える「AWS Amplify」と純粋なヘッドレス CMS である「microCMS」を使った結果、なぜ microCMS を選んだのか

こんにちは！株式会社キカガクの開発事業部でソフトウェアエンジニアをしている塚井です。数ヶ月前からフロントエンドエンジニアとなるべく奮闘中です。今回はそんな中で経験したヘッドレス CMS の比較記事を書きたいと思います！

対象読者
概要
予備知識
なぜ microCMS にしたのか
おわりに
おまけ
採用情報

対象読者

WordPress などの CMS ではかゆいところに手が届かないなどの理由で、Web サイトを構築したいが、開発コストを抑えたい！でも、非エンジニアが高頻度でコンテンツを追加したい！！という場合はヘッドレスCMS の利用がおすすめです。今回は数あるヘッドレス CMS の中でどのサービスを使うか迷っている方向けの記事となります。

概要

キカガクのコーポレートサイトをリニューアルする際、当初は AWS Amplify をヘッドレス CMS のように使用する予定でしたが、検証した結果、純粋なヘッドレス CMS である microCMS を使うことしました。大きな理由は、以下 2 点です。

AWS Amplify が発展途上であった（2017 年後半にリリースされたサービスで、私が検証したのは 2022 年 2月）
microCMS のドキュメントや API の使いやすさ、細かいところがすばらしかった！

予備知識

ヘッドレス CMS とは
blog.microcms.io
AWS Amplify とは
aws.amazon.com
microCMS とは
microcms.io

なぜ microCMS にしたのか

当初 AWS Amplify を選んだ理由

コンテンツ管理の GUI に markdown 用エディタが内蔵されている
Client code generation で開発コストが削減できそう

AWS Amplify を諦めた理由

大きく 2 つあげますが、まだ発展途上だからこその問題だと思います。また、私の英語力・技術力不足かもしれませんのでアドバイス等あれば是非ご教示ください。

Amplify Studio(GUI) や CLI のバグ？
最初に直面した問題は使い勝手でした。Amplify Studio でスキーマ設定をした後、デプロイしようとするとエラーとなり、プロジェクトごと作り直すことが数回ありました。原因は不明確ですがリレーションなどを設定し直したりするとよく起こった気がします。他にも怪しい挙動があり、調べて解消できない場合は一から作り直すを繰り返しました。
ドキュメント
ドキュメントはありますが、基本の使い方メインのため、やりたいことが明確に決まっている場合に細かいカスタマイズ用の調査が大変でした。 docs.amplify.aws

この 2 点と、私が初めてフロントエンドの実装をしていたこともあり、

うまくいかない原因が自分なのか AWS Amplify 側か切り分ける作業が長時間に及んだ
仕様のフィージビリティの調査も難航した

などの紆余曲折を経て、ある程度成熟したヘッドレス CMS に切り替えることとなりました。

microCMS に変更した理由

いざ切り替えとなったときに、こちらのサイトなどで比較検討し、 microCMS が無料だったので気軽に試したところとても気に入ったためそのまま決定しました。気に入った点を以下に記載していきます。

日本語ドキュメント・公式ブログ
microCMS は日本企業で作成されているため日本語ドキュメントです。AWS Amplify の課題解決で issues を追うのに疲れた心に染みました。また、公式ブログが頻繁に更新されており、Web で「microCMS 『やりたいこと』」を検索すると高確率で公式の解決方法がヒットしてサクサク開発が進みます！
公式の実装サンプル
公式の実装サンプルが GitHub にあるので私のようなフロントエンド始めました！なエンジニアでも安心です。
SDK もあるので、今回はこちらの Readme.md の方法を採用しました。
API がシンプル
シンプルで使いやすいです。そして GUI で試せるのでプログラムで実装前の確認も簡単！あったら便利だけど必須ではない機能などもあり UX へのこだわりが感じられます。GUI の画面を貼っておきますが、分かりづらいと思うので是非無料登録して体感していただきたいです！
microCMS の API 用 GUI
全文検索に対応
API のオプション ’q’ で対応しています。AWS Amplify のときは Algolia などの外部サービスを想定していましたが、CMS 内で完結できます！
コンテンツにボタンが埋め込めるように
キカガクでは研修の紹介などをしているので「申込ボタン」をコンテンツに埋め込みたかったのですが、markdown でコンテンツを作成しようとしていた時はボタンを断念していました。しかし、microCMS の以下の記事を見つけてボタンだけでなく、色々な機能が使えるようになりました！AWS Amplify でも同じアイデアを取り入ればできそうですが、実装コストはかかると思います。 blog.microcms.io
料金プラン・利用状況の分かりやすさ
料金プランのページも分かりやすいのですが、ログインすると利用状況のグラフも確認できます。他サービスでは~~わざとじゃないかと思うくらい~~複雑な料金プランとグラフで結局いくらか分かりづらいものがありますが、シンプルで一目瞭然です。

おわりに

以上の理由で、microCMS に変更して現状幸せな開発ライフを送っています。

今回の記事を書く上で、microCMS のサービス開始を調べたところ 2019 年でした。「ある程度成熟した」ヘッドレス CMS を選んだつもりが AWS Amplify より新しかったことに驚愕ですね・・・。とはいえ、AWS Amplify は拡張性や機能も多く、目的もヘッドレス CMS だけではないと思うので今後のアップデートに期待したいと思います！