自社製CMSからmicroCMSへのリプレースがプロダクトグロースを加速させた話

microCMS Meetup 2025のSESSION1「microCMS ユーザーLT - 3つの実践に学ぶ、microCMS導入と運用のヒント」におけるLT資料

Transcript

1. 自社製CMSからmicroCMSへの リプレースがプロダクトグロースを 加速させた話 株式会社ネクストビート 執行役員 CPO 川井淳矢 2025年8月22日 microCMS Meetup 2025 SESSION1 「microCMS ユーザーLT - 3つの実践に学ぶ、microCMS導入と運用のヒント」
2. Copyright © nextbeat All Rights Reserved. 2 microCMSユーザーLTのテーマ microCMS導入と運用のヒント
3. Copyright © nextbeat All Rights Reserved. 3 microCMSユーザーLTのテーマ 自社製CMSから microCMSへのリプレース
4. Copyright © nextbeat All Rights Reserved. 自己紹介 4 株式会社ネクストビート Product & Marketing Division 執行役員CPO (Chief Product Officer) エンジニア 　 8年半　　　microCMS　2年半 CPO & PdM　1年半 X:　@_jk_nb SNS 部署 経歴 所属 役割 川井淳矢 名前
5. Copyright © nextbeat All Rights Reserved. 5 • リプレースの対象プロダクト、背景 • 苦労したこと、工夫したこと • リプレース後の変化 アジェンダ
6. Copyright © nextbeat All Rights Reserved. 6 • リプレースの対象プロダクト、背景 • 苦労したこと、工夫したこと • リプレース後の変化 アジェンダ
7. Copyright © nextbeat All Rights Reserved. 7 対象プロダクト
8. Copyright © nextbeat All Rights Reserved. 8 対象プロダクト • KIDSNA STYLE (子育て情報メディア ) • コンテンツのボリューム的には 約2万本の記事、ニュース、動画等を掲載
9. Copyright © nextbeat All Rights Reserved. • いわゆる技術負債を解消したかった ◦ 言語、フレームワークもフルリアーキテクチャ ◦ 自社製のCMSもスコープに ▪ CMSをリッチに作り込んだ結果... • 新規開発、保守運用コストが増加 • コードが荒れてグロースが遅れる ◦ 納期は半年、パフォーマンス/機能劣化はNG 9 リプレースの背景
10. Copyright © nextbeat All Rights Reserved. 移行の流れ 10 01 02 03 04 検証・修正 05 リリース 01〜04を何回か繰り返し、なんとか半年で完了 データの棚卸し 不要モデル削減 microCMS の設計 データ移行 アプリ開発
11. Copyright © nextbeat All Rights Reserved. • 苦労したこと、工夫したこと ◦ データマイグレーション、S3連携 ◦ 表示速度の課題と高速化 ◦ 便利なSDK開発 11 アジェンダ
12. Copyright © nextbeat All Rights Reserved. • 苦労したこと、工夫したこと ◦ データマイグレーション、S3連携 ◦ 表示速度の課題と高速化 ◦ 便利なSDK開発 12 アジェンダ
13. Copyright © nextbeat All Rights Reserved. • microCMSのPUT APIを利用 ◦ 全データを移行するスクリプトを作成 ▪ DB → json → microCMS • WriteAPIのRateLimitに注意 • 画像や動画はAWSのS3に格納していた ◦ 当時はAPIでメディアをアップできなかった ◦ そのままS3で運用する方針にした 13 データマイグレーション
14. Copyright © nextbeat All Rights Reserved. 14 • 拡張フィールドを活用して microCMSからS3に画像アップロードす る機能を開発した • S3にファイルをアップするアプリを作成 し、URLアクセスできるようにホスティン グ • 画像アップロード後、iframe経由で、画 像アクセスに必要な情報を取得し microCMSに渡して保存 S3とmicroCMSの連携
15. Copyright © nextbeat All Rights Reserved. • ライターの体験を損なわないように トンマナをmicroCMSに合わせている トリミング アップロード済みの画像の参照 なども可能 多分ライターさんには デフォルト機能だと思われている 15 S3とmicroCMSの連携
16. Copyright © nextbeat All Rights Reserved. • 苦労したこと、工夫したこと ◦ データマイグレーション、S3連携 ◦ 表示速度の課題と高速化 ◦ 便利なSDK開発 16 アジェンダ
17. Copyright © nextbeat All Rights Reserved. • KIDSNA STYLEの仕様上の課題 ◦ コンテンツ参照の階層(depth)が深い ◦ コンテンツの量が多い ▪ depth=3でコンテンツ量が多いと データ取得時間が長くなる ◦ できるだけ表示速度は早くしたい ▪ なんとか高速化を...要件的にSSRで... 17 表示速度の課題
18. Copyright © nextbeat All Rights Reserved. • メインコンテンツはdepth=0 or 1で取得 • カテゴリ、出演者、タグ、などの参照コンテンツを全件取 得してBFFでキャッシュする • BFFで記事と参照コンテンツをjoinする • 早ければ0.5s、遅くても1s弱くらいで 画面表示が可能になった 18 高速化
19. Copyright © nextbeat All Rights Reserved. • 苦労したこと、工夫したこと ◦ データマイグレーション、S3連携 ◦ 表示速度の課題と高速化 ◦ 便利なSDK開発 19 アジェンダ
20. Copyright © nextbeat All Rights Reserved. • stringで複雑なfilter条件を書くのはちょっと怖い ◦ 型安全な関数を自作 20 便利なSDK開発
21. Copyright © nextbeat All Rights Reserved. • 各フィルターを関数化 • and/orで簡単に条件を繋げるように 21 便利なSDK開発
22. Copyright © nextbeat All Rights Reserved. 22 • リプレースの対象プロダクト、背景 • 苦労したこと、工夫したこと • リプレース後の変化 アジェンダ
23. Copyright © nextbeat All Rights Reserved. • コンテンツ管理ではなく機能開発に集中できるように なった ◦ CMSの改修、メンテコストが発生しないのが こんなにも快適だとは思わなかった... • 新人のキャッチアップコストも大きく下がった ◦ 改修前：誰も触りたくない... ◦ 改修後：作りやすいですね！ 23 リプレース後の変化
24. Copyright © nextbeat All Rights Reserved. 24 開発ロードマップに ユーザーインサイトをしっかりと 反映いただいている！ どんどん移行しやすい 環境が整ってきている 多分そのうち移行スクリプトとか 不要になる...かも... 思い立ったら移行しよう！ おまけ　microCMSの進化
25. Copyright © nextbeat All Rights Reserved. 25 2 5 ご静聴ありがとうございました