はじめに
前回の記事で Astro + microCMS + Netlify でブログを構築した話を書きました。サイト自体は完成しましたが、次の課題が残っていました。それが記事を書く手間です。
記事を書く → microCMS の管理画面を開いて貼り付ける → フィールドを埋める → 下書き保存する。この一連の作業を毎回繰り返すのは想像以上に面倒でした。
そこで試したのが microCMS の MCP サーバーとの連携です。AI ツールから直接 microCMS を操作できるようになり、テーマを伝えるだけで下書き投稿まで完了するワークフローが実現しました。この記事ではその仕組みとセットアップ手順を紹介します。
MCP サーバーとは何か——一言で説明する
「MCP サーバー」という言葉を初めて聞く方も多いと思います。
MCP(Model Context Protocol)は、Anthropic が 2024 年 11 月に発表した、AI ツールと外部サービスをつなぐための標準プロトコルです。難しく聞こえますが、要するに「AI ツールが外部のサービスを道具として使えるようにする仕組み」です。
USB-C で例えるならわかりやすいかもしれません。以前は充電器がデバイスごとにバラバラだったのが、USB-C という標準規格ができたことで「どのデバイスにも同じケーブルが使える」ようになりました。MCP はその AI 版です。一度 MCP に対応したサービスであれば、Claude Code や Codex など対応している AI ツールからまとめて操作できます。
microCMS はこの MCP に対応したサーバーを公式にリリースしており、AI ツールから記事の取得・作成・更新が可能になっています。
microCMS MCP サーバーでできること
接続後は、AI ツールに話しかけるだけで以下のことができます。
- 記事の一覧取得: 「公開済みの記事を一覧で見せて」
- 記事の作成(下書き): 「このテーマで記事を書いて、下書きとして保存して」
- 記事の更新: 「この記事の excerpt を修正して」
- メディアのアップロード: 「この画像を microCMS にアップロードして」
コードを書かずに、自然言語の指示だけで CMS を操作できるのが最大の特徴です。
セットアップ手順
Claude Code 向け:.mcp.json をプロジェクトルートに配置する
Claude Code では、プロジェクトルートに .mcp.json を置くことでプロジェクト単位で MCP サーバーを設定できます。
{
"mcpServers": {
"microcms": {
"command": "cmd",
"args": [
"/c",
"npx",
"-y",
"microcms-mcp-server@latest",
"--service-id",
"your-service-id",
"--api-key",
"your-api-key"
]
}
}
}your-service-id は microCMS のサービス ID、your-api-key は API キーに置き換えてください。
このファイルは .gitignore に追加して GitHub にコミットしないようにしてください。API キーが含まれているため、公開リポジトリに上がると第三者に悪用されるリスクがあります。
設定後は Claude Code を再起動すると MCP サーバーが認識されます。
Codex CLI 向け:config.toml に追記する
Codex CLI では、グローバル設定ファイル ~/.codex/config.toml に MCP サーバーの設定を追記します。
[mcp_servers.microcms]
command = "npx.cmd"
args = ["-y", "microcms-mcp-server@latest", "--service-id", "your-service-id", "--api-key", "your-api-key"]Windows 環境では npx ではなく npx.cmd を使う必要があります。Linux・Mac では npx のままで問題ありません。
API キーの権限設定について
microCMS の管理画面で API キーの権限を設定する際、ひとつ注意点があります。
hobby プランでは API キーを 1 つしか作成できません。そのため、AI ツール用と本番サイト用で同じキーを共用することになります。
この場合、「下書きコンテンツの全取得」権限は外しておくことをおすすめします。権限を外しても AI ツールからの下書き作成・更新は引き続き可能です。外すことで、万が一の場合に下書き記事が本番サイトに表示されるリスクを防げます。本番サイト側でも publishedAt[exists] フィルターを使って公開済み記事のみ取得するようにしておくと、二重の安全策になります。
実際のワークフロー——話しかけるだけで下書き投稿まで完了する
セットアップ後のワークフローは次のとおりです。
1. テーマと方針を伝える
「Astro + microCMS + Netlify でブログを構築した話を記事にしたい。
読者は初心者も意識して。技術解説型で体験談を含む構成にしてほしい。」2. 構成案の確認
AI がキーワードリサーチと記事構成案を提示します。見出しの順序や抜け漏れを確認して承認します。
3. 執筆
承認後、AI が本文を執筆します。SEO を意識したタイトル・メタディスクリプション・本文が生成されます。
4. 下書き投稿
執筆完了後、MCP サーバー経由で microCMS に直接下書き投稿されます。管理画面を開いてコピペする作業が不要になります。
「この内容で microCMS に下書きとして投稿してください。
スラッグは astro-microcms-netlify-blog で。」この一連の流れを、ターミナルと管理画面を行き来することなく完結できるのが大きな利点です。
やってみてよかったこと・気になったこと
よかったこと
執筆の心理的ハードルが下がった。「書かなきゃ」という気持ちはあっても、管理画面を開いてフィールドをひとつひとつ埋める作業が億劫でした。AI に話しかけるだけで下書きまで完了するようになってからは、思い立ったときにすぐ動けるようになりました。
HTML 変換が不要になった。microCMS のリッチエディタは HTML を受け付けるため、Markdown で書いた記事を HTML に変換する手間がありました。AI が HTML ごと生成して投稿してくれるため、この変換作業がなくなりました。
Claude Code・Codex の両方から操作できる。Claude Code はアーキテクト・PM 的な役割、Codex CLI は実装エンジニア的な役割と使い分けているため、どちらからも microCMS を操作できるのは便利です。
気になったこと
最終確認は必ず人間が行う。AI が生成した記事は必ずしも完璧ではありません。事実確認・ニュアンスの調整・画像の追加は人間が担当する必要があります。下書きとして投稿してから管理画面で確認・修正するフローを必ず挟むようにしています。
API キーの管理に注意が必要。設定ファイルに API キーを書くため、誤って Git にコミットしないよう .gitignore の設定を必ず確認してください。
まとめ
microCMS の MCP サーバーを Claude Code・Codex CLI に接続することで、記事の執筆から下書き投稿までを一気通貫で自動化できました。
ツール | 設定ファイル | 対象範囲 |
|---|---|---|
Claude Code |
| プロジェクト単位 |
Codex CLI |
| グローバル |
セットアップ自体は数分で完了します。microCMS を使っているブログオーナーなら試してみる価値は十分あります。「記事を書くのが面倒」と感じている方は、ぜひ導入を検討してみてください。