microCMS移行をいまならAIでどう進めるか - microCMS Meetup 2026

イベント
microCMS Meetup 2026
https://microcms.connpass.com/event/394654/

登壇者
ニフティ株式会社
石川 貴之
宮本 達矢

Transcript

1. microCMS移行を いまなら AIでどう進めるか 〜3年前の技術選定振り返りと AIの登場で変わったこと〜 2026/07/22 microCMS Meetup 2026 ニフティ株式会社 石川 貴之 宮本 達矢 Copyright © NIFTY Corporation All Rights Reserved. Copyright © NIFTY Corporation All Rights Reserved.
2. オープニング ⾃⼰紹介 ニフティ株式会社 カスタムリレーショングループ テックリード / Cloud Architect 石川 貴之 (Ishikawa Takayuki) 担当業務 • CCoE的活動（AWS/GCP組織管理） • AI CoE的活動（AI関連の導入や活用促進） • 技術寄りSaaS管理（Notion, GitHubなど） • 自社WEBサービスの設計、バックエンド Copyright © NIFTY Corporation All Rights Reserved. 2
3. オープニング ⾃⼰紹介 ニフティ株式会社 カスタムリレーショングループ 宮本 達矢 (Miyamoto Tatsuya) 担当業務 • @niftyトップページの開発運用 • 社内microCMSの管理 • WEBサービスの基盤管理 Copyright © NIFTY Corporation All Rights Reserved. 3
4. Copyright © NIFTY Corporation All Rights Reserved. 4
5. 本⽇お話すること 技術選定フェーズ ※振り返りのみ 🔍 技術選定‧アーキテクチャの意思決定 こんな⼈へ：技術選定を担当する⽅、アーキテクトの⽅ 「運⽤重視」で選んだ構成が3年後でも正常に働いているか答え合わせをします。 移⾏フェーズ 🚚 移⾏の実作業（スキーマ設計‧移⾏処理） こんな⼈へ：CMS移⾏をこれから計画‧実施する⽅ ⼤量のhtmlを今AIを使って移⾏するならどうやるか 運⽤フェーズ 🛠 ⽇々の開発‧改修、コンテンツ運⽤‧保守 こんな⼈へ：サイトを開発‧改修するエンジニアの⽅、コンテンツ運⽤者、サイトの保守を担う⽅ 修正依頼をAgentに任せる開発フロー 🖥 実例紹介 ― @niftyトップページ ログインあり動的サイトにおけるケーススタディとして、20年来の⾃社製CMSから段階的に脱却中の現在進⾏形の事例をお⾒せします Copyright © NIFTY Corporation All Rights Reserved. 5
6. 参考：移⾏時のプロジェクトマネジメントと技術選定の話 https://speakerdeck.com/niftycorp/20250208-nifty-tech-day-2025-ishikawa Copyright © NIFTY Corporation All Rights Reserved. 6
7. SECTION 01 microCMS利⽤状況 Copyright © NIFTY Corporation All Rights Reserved. 7
8. MICROCMS利⽤状況（2026年） 移⾏から3年、19サイトまで拡⼤ 19 Advanced 42 運⽤サイト数 契約プラン ※1 API数（サイト間共有あり） 70 24 1TB ユーザー数 ロール数 ⽉間データ転送量 ※1：2025年6⽉のプラン改定に伴い、現在はAdvancedプランの新規契約はできません。同様の機能をEnterpriseプランで提供しています。 Copyright © NIFTY Corporation All Rights Reserved. 8
9. SECTION 02 技術選定の振り返り ホスティング先‧フレームワーク‧CMSの3テーマで、 当時の選定基準と現在の結果を振り返る Copyright © NIFTY Corporation All Rights Reserved. 9
10. 3年前の移⾏プロジェクト 移⾏に関する基本⽅針 提供する価値 求める姿勢 「前に戻りたくない」と感じてもらう 低いところに揃えない ＋ わかりやすい成果と体験価値で⽰す 学習コストを避けると構成が歪になる （早い‧安い‧うまい） （Git管理、ファイルサーバー的運⽤の廃⽌を強制） Copyright © NIFTY Corporation All Rights Reserved. 10
11. 移行前の構成 ドメインごとにLBがある Copyright © NIFTY Corporation All Rights Reserved. 11
12. 現構成 Copyright © NIFTY Corporation All Rights Reserved. 12
13. 参考：移⾏前後の⽐較 Before After クラウド FJcloud-V AWS ホスティング先構成 LB+サーバー CloudFront+Amplify フレームワーク Struts Astro テンプレート言語 Velocity改造版 / JSP Astro 複数環境対応 2 ※一部共用利用 50 ※Amplify上限 デプロイ方法 ファイルアップロード GitOps CMS nifty CMS(独自) microCMS CMS認証 nifty ID(自社) SAML ビルド時間 - 大幅改善 CWV - 大幅改善 コスト(SaaS費用含む) - 76%削減 高アクセス負荷対応力 - 100倍以上 開発オンボーディング 1ヶ月以上 数日 Copyright © NIFTY Corporation All Rights Reserved. 13
14. 技術選定の振り返り① ホスティング先：AWS（Amplifyメイン） 現状のままで ⼤きな問題なし GOOD 選定基準：引継ぎ容易性 → 構成がシンプルなのもあり引継ぎコストは低い GOOD 選定基準：開発利便性 → 必要⼗分、branch/PRごとの環境作成は必須 Amplify中⼼＋CloudFront/S3/Lambdaで補完。 GitHub push‧microCMS更新をトリガーに⾃動ビル ド（IaCはCDK）。 SO-SO 選定基準：コスト → アクセス数に応じて増えているが許容範囲 反省 IaCが例外対応の建て増しで複雑化 AWSリソース上限に想定より早く接近 Copyright © NIFTY Corporation All Rights Reserved. 14
15. 技術選定の振り返り② フレームワーク：Astro 今も問題なし SSG中⼼の構成のた め安⼼感がある GOOD 選定基準：引き継ぎ容易性 → AIが賢くなったため更に学習コストが低減 GOOD 選定基準：制作部隊への受け⼊れやすさ → 扱える⼈は増えてきている jQueryと同居できているのもポイント⾼い プロモーション等で急なアクセス負荷があっても安⼼ GOOD 選定基準：将来性 → AstroがCloudflare傘下になる State of JavaScript 2025でも⾼評価 Copyright © NIFTY Corporation All Rights Reserved. 15
16. 技術選定の振り返り③ CMS：microCMS 結果的に良い選択 だった GOOD 選定基準：使いやすさ → コンテンツ運⽤者からの評判が良い、⼀般的な質 問が来ない。Enterprise向け機能を有している。 GOOD 選定基準：運⽤の幅が広がる機能性 フィードバックを聞いて機能アップデートしてくれる → カスタムフィールドで例外対応ができたり、 姿勢はとても助かりました ヘッドレスCMSのため組む相⼿を選ばないのは強み （マネジメントAPI拡充、APIグルーピング、ビュー機 能、コンテンツフィルター拡充は特に欲しかった） SO-SO 選定基準：コスト → 特別⾼いわけではないので許容範囲。機能アップ デートにより導⼊当時の困りごとも減ってきている。 Copyright © NIFTY Corporation All Rights Reserved. 16
17. SECTION 03 いまならAIでこう進める ― 移⾏と運⽤のアップデート スキーマ設計‧移⾏処理‧コンテンツ運⽤の3テーマで、 当時の苦労を「いまのAI」なら解消できるか Copyright © NIFTY Corporation All Rights Reserved. 17
18. AIでこう進める ① スキーマ設計 ⼈⼿の命名 から、 規約 × レビュー へ Copyright © NIFTY Corporation All Rights Reserved. 18
19. AIでこう進める① スキーマ設計 スキーマ設計これまで｜⼈が考えて設計する 1 2 3 画⾯や旧CMSを⾒ながら ⼈の癖で命名が揺れる リリース後の ⼈がスキーマを設計 （image / images /url / link…） ⼊れ⼦‧構造の修正は ※旧CMSはスキーマ名固定 調整‧確認が⼿間 なので踏襲はできない 当時はファイル名やフォルダ構成しか規約を作ってなかった 単語のチョイスまでルール化するのは⼤変 Copyright © NIFTY Corporation All Rights Reserved. 19
20. AIでこう進める① スキーマ設計 スキーマ設計いまなら｜作成はAIが提案、更新は毎⽇⾃動レビュー ✦ 作成｜AIが提案し、⼈がレビューする 元のDBやHTMLを コンテキストとして渡す ClaudeのSkillで 推奨スキーマを作成‧提案 ⼈がレビューして microCMSに登録 （規定にない単語チョイスはAI任せ） ✦ 更新｜GitHub Actionsで毎⽇⾃動レビュー スキーマとコンテンツを ⽇次で取得（バックアップ兼⽤） 前⽇分との差分を検出 規約違反を指摘 （構造化情報のみならチェックにAIは不要） 💡 理想はスキーマ定義をIaC化してレビュー＆デプロイできること なのでmicroCMS開発ロードマップにあるAPI作成‧変更マネジメントAPIに期待！ Copyright © NIFTY Corporation All Rights Reserved. 20
21. AIでこう進める ② 移⾏処理 ⼈⼿の繰り返し から、 スクリプトを育てるループ へ Copyright © NIFTY Corporation All Rights Reserved. 21
22. AIでこう進める② 移⾏処理 移⾏処理これまで｜⼈が⼿を動かして繰り返す 1 2 3 元HTMLをスクレイピング、 レイアウトや Buildエラー‧ シェルや置換で コンポーネントを キャプチャ差分を⾒て Astro形式へ 切り出す ⼿作業で修正 ↺ 同じ動き‧⾒た⽬になるまで修正を何度も繰り返す、根気のいる作業 移⾏作業をしていた2023年時点では、⼿持ちのAIはGitHub Copilotのみ Copyright © NIFTY Corporation All Rights Reserved. 22
23. AIでこう進める② 移⾏処理 移⾏処理いまなら｜AIが「再現可能なスクリプト」を育てる ✦ AIがスクリプトを育てるループ 書き換え後の他サイトや サンプル、命名規則や スクリプトで HTMLを⼀括書き換え エラー‧表⽰差分を チェック Claudeが スクリプトを改善 ルールをコンテキスト として渡す エラー‧差分ゼロまで⾃動で回す 💡完成形が⾒えている修正の繰り返しはAIに任せやすい 最初のレイアウト‧コンポーネント設計は⼈⼒推奨。AIがっつり利⽤は2サイト⽬から Copyright © NIFTY Corporation All Rights Reserved. 23
24. AIでこう進める② 移⾏処理 効果｜移⾏は「⽉」から「⽇」単位の作業になった 1〜2⽇ 約5⽇ 約10倍速 ガワだけ移す 最適化までやる 2023年当時と⽐較 1000ページ以上Astro化（1レイアウト） 30レイアウト‧200コンポーネントに集約 GitHub Copilotのみだった当時の ＋microCMSへのコンテンツ移⾏のみ （CMSで管理されていないページを1000以上持っ 約1/10の時間で仕上がる ているサイトの場合） 💡 ⼈の役割は「書き換え作業」から「どこまで最適化するかの判断」に変わった Copyright © NIFTY Corporation All Rights Reserved. 24
25. AIでこう進める② 移⾏処理 最適化の例｜⼈の判断が要るところ レイアウトの統合 コンポーネント化 直書きページ群のmicroCMS化 ヘッダーとフッター以外は共通化され いろんなページに微妙に異なるHTML とりあえず直書きで始めたが結構な分 ていないページ群のレイアウト化、 で直書きされている注釈やパーツの単 量になったFAQや読み物コンテンツな 微妙に異なるレイアウトの単⼀化 ⼀化 どの移し替え Copyright © NIFTY Corporation All Rights Reserved. 25
26. AIでこう進める ③ コンテンツ運⽤ ⼈の切り分け‧依頼 から、 Agentに任せるフロー へ Copyright © NIFTY Corporation All Rights Reserved. 26
27. AIでこう進める③ コンテンツ運⽤ コンテンツ運⽤これまで｜⼈が切り分けて、⼈が直す 1 2 3 修正したい箇所が microCMS管理なら GitHub管理のコードなら どこの管理か コンテンツ運⽤者が 開発者に依頼して修正 HTMLを⾒ながら⼈が探す ⾃⾝で修正 ✎ 切り分けには知識が必要、依頼すると待ちが発⽣ Copyright © NIFTY Corporation All Rights Reserved. 27
28. AIでこう進める③ コンテンツ運⽤ コンテンツ運⽤いまなら｜Notion Custom Agent × Cursor Agentに任せる ✦ ① 切り分けと依頼 Notion AIに 修正したい箇所が どこ管理か聞く ✦ ② Agentの⾃動処理 GitHub管理なら Notion AIに Issueを作ってもらう 依頼者はNotion上で完結 修正して PR作成 実⾏結果と PRのURLを Notionにコメント ✎ Issueステータス変更でトリガー 💡 切り分け → 修正依頼 → コード修正‧PR作成までAgentが対応、リードタイムはほぼゼロ microCMSの下書き作成まで任せる場合は、既存下書きの上書きに注意 Copyright © NIFTY Corporation All Rights Reserved. 28
29. AIでこう進める③ コンテンツ運⽤ Notion Custom Agent × Cursor Agentの動作例 カンバン Issue Agentのログ Issueを エージェント待ち ステータスにするだけで PRまで自動作成 PRごとに環境が作られるので目 視確認も可能 Copyright © NIFTY Corporation All Rights Reserved. 29
30. SECTION 04 実例紹介 ― @niftyトップページ Copyright © NIFTY Corporation All Rights Reserved. 30
31. @niftyトップページへのmicroCMS導⼊ › 会員向けポータルサイト › 2022年にガワのみNext.jsへ刷新 › SSR動作かつ定期的にスパイクアクセスが発⽣ › 多数のコンテンツがCMS経由で管理‧更新される （PC 26件∕SMP 16件の取得データを表⽰） Copyright © NIFTY Corporation All Rights Reserved. 31
32. @niftyトップページのmicroCMS構成：⼀時キャッシュ⽅式 メリット Webhook ✓ S3配置のためmicroCMSの状態に⾮依存 （耐障害性） ✓ 緊急時はJSONを直編集して即時変更が可 能 デメリット △ microCMSのデータ転送量枠を活⽤し づらい → microCMS → API Gateway → Lambda S3 ↑ JSON取得 @niftyトップページ サーバ microCMSの状態に依存せず、S3から直接配信することで耐障害性を確保 △ 管理する作り物（Lambda‧API GW等） が増える Copyright © NIFTY Corporation All Rights Reserved. 32
33. AI活⽤：開発の効率化 Skill化：作り物を効率化 MCP活⽤：データ移⾏と表⽰修正 › 繰り返し実装するパターンをSkill化して対応 › CSV化した内製CMSのデータをMCP経由で microCMSに投⼊ › 変更箇所を指⽰し、10分放置で実装は完了 › スキーマの変換などもだいたい良い感じに処理 してくれる › 編集に違和感があればSkillの⾒直しが必要 › 表⽰が崩れた場合もChrome DevTools MCPで 細かい指⽰なしに修正 Copyright © NIFTY Corporation All Rights Reserved. 33
34. AIで運⽤補助ツールを簡単に作成 cmsに登録したいデータを スプレッドシートに記入 csvをインポートするだけで 十数件のコンテンツを 一括登録 › 別ページへの⾒出しリンクやバナーを毎⽉⼀括で 投⼊しており、管理画⾯から個別に作成するのは⼿間 › スプレッドシートに書き出し、GASで投⼊⽤CSVを⽣成 - カスタムフィールド利⽤時は形式変換が必要 › 画像アップロード‧公開予約も実施できるように拡張 ドライブのリンクを元に 画像をcmsにアップロード Copyright © NIFTY Corporation All Rights Reserved. › 雑に作れるからこそ機能はシンプルに 34
35. SECTION 05 まとめ Copyright © NIFTY Corporation All Rights Reserved. 35
36. まとめ 技術選定の振り返り 01 運⽤重視の技術選定は、3年経っても効いている。⽬⽴った困りごとが、出てこないのが⼀番の成果 利便性の部分でケチにならない、必要以上に妥協しない構成が、運⽤⼯数2⼈⽇/⽉‧問い合わせほぼゼロ という結果に繋がった 移⾏の実作業におけるAI利⽤ 02 AIで移⾏は「⽉」から「⽇」単位へ。⼈の役割は判断に変わった 移⾏作業は2023年⽐ 約10倍速。AIにはコードを直接編集ではなく「再現可能なスクリプト」を育てさせるのかトークン効率も良い。 コンテンツ運⽤‧保守におけるAI利⽤ 03 運⽤は「⼈が考えて作業する」から「Skillで揃える‧Agentに任せる」へ 実現にはGitOpsやデプロイフローの整備が必須だった。「低いところに揃えない」効果。 技術選定の成功は、AI時代への良い下地を作ってくれた Copyright © NIFTY Corporation All Rights Reserved. 36
37. Copyright © NIFTY Corporation All Rights Reserved. Copyright © NIFTY Corporation All Rights Reserved.