はじめに
「ChatGPTでブログ記事を書いた。すごい、3分で終わった!」
...で、そのあとどうしていますか?
生成されたテキストをコピーし、CMSの管理画面を開き、タイトルをペーストし、本文をペーストし、見出しを整え、画像をアップロードし...。
「これ、執筆より入稿の方が時間かかってないか?」
私は現在、自社で外国人向け多言語メディア ibis (アイビス) を運営しています。
記事数はリリース直後で140記事以上。これを一人で、しかも手動で入稿していたら、私の指紋はなくなっていたでしょう。
本記事では、Next.js (App Router) とヘッドレスCMS Sanity を組み合わせ、Dify × n8n で「企画から入稿まで」を完全自動化したアーキテクチャを公開します。
この記事で得られる知見
- 🧠 Dify: 構造化データ(JSON)を出力させるプロンプト設計
- 🦾 n8n: Sanity APIを叩いて記事をCreate/Updateするフロー
- 🧱 Sanity: AIの出力を「Portable Text」に変換する泥臭い実装
1. なぜ WordPress / microCMS ではなく「Sanity」なのか?
自動化を前提とする場合、CMS選定の基準は「管理画面の使いやすさ」ではありません。「APIの柔軟性(Programmability)」 です。
私が Sanity を選んだ理由は以下の3点です。
- Content as Data: 記事を単なるHTMLの塊ではなく、完全に構造化されたJSON(Portable Text)として扱う思想。
- GROQ (Graph-Relational Object Queries): GraphQLよりも柔軟に、必要なデータを必要な形に整形して取得できるクエリ言語。
- Write APIの強さ: 記事の作成、更新、画像のアップロードまで、すべてがAPI経由で完結する。
特に3点目が重要です。Sanityなら、「管理画面を一度も開かずにメディアを運営する」 ことが現実的に可能です。
2. アーキテクチャ全体像
「脳」であるDifyと、「手足」であるn8nを、Sanityという「データベース」に接続します。
3. 実装の壁:Markdownを「Portable Text」に変換せよ
ここが最大のハマりポイントです。
Dify(LLM)はMarkdownを出力するのが得意ですが、SanityはMarkdownをそのまま保存することを推奨していません。Sanity独自の Portable Text というブロック形式のJSONで保存する必要があります。
❌ やりたくないこと
Difyに無理やり複雑なPortable TextのJSON構造を出力させること。(トークン消費が激しく、ハルシネーションの原因になります)
✅ 解決策:n8nのCodeノードで変換する
DifyからはシンプルなMarkdownを受け取り、n8nのJavaScript (Code Node) でパースしてSanity形式に変換します。
以下は、n8nで実際に稼働させている変換ロジックの簡易版です。
// n8n Code Node: Markdown to Portable Text (簡易版)
const markdown = items[0].json.body; // Difyからの入力
const blocks = [];
// 改行で分割してブロック化する泥臭い処理
const lines = markdown.split('\n');
for (let line of lines) {
if (line.startsWith('## ')) {
// H2見出し
blocks.push({
_type: 'block',
style: 'h2',
children: [{ _type: 'span', text: line.replace('## ', '') }]
});
} else if (line.length > 0) {
// 通常の段落
blocks.push({
_type: 'block',
style: 'normal',
children: [{ _type: 'span', text: line }]
});
}
}
return { json: { blocks } };
※実際には、リスト(- )や太字(**)のパース処理も入りますが、基本思想は 「AIにはプレーンなテキストを書かせ、システム側で構造化する」 です。
4. Sanity APIへのPOST (n8n HTTP Request)
データが整ったら、Sanityの Mutations API を叩きます。
-
Method:
POST -
URL:
https://<PROJECT_ID>.api.sanity.io/v2021-06-07/data/mutate/<DATASET> -
Headers:
Authorization: Bearer <SANITY_TOKEN>
// Body Example
{
"mutations": [
{
"createOrReplace": {
"_type": "post",
"title": "Difyとn8nで自動化する方法",
"slug": { "_type": "slug", "current": "dify-n8n-automation" },
"body": [ ...Portable Text Blocks... ],
"publishedAt": "2025-12-10T12:00:00Z"
}
}
]
}
これで、n8nの実行ボタンを押した瞬間(あるいはDifyが完了した瞬間)、Sanity上に記事が「公開状態」で生成されます。
5. 成果と実稼働デモ
このシステムを構築した結果、以下の成果が得られました。
- 入稿工数: 1記事あたり20分 → 0分
- ヒューマンエラー: コピペミス、タグ付け忘れ → ゼロ
- 私の役割: 「ライター兼オペレーター」から 「編集長(プロンプトエンジニア)」 へシフト
🌐 実稼働ショーケース:ibis (アイビス)
この「完全自動入稿フロー」によって構築・運用されているのが、以下のメディアです。
(※Next.js App Router × Sanity × Cloudflare で爆速動作中)
サイトを見ていただければわかりますが、AIが書いた記事であっても、SanityとNext.jsの組み合わせにより、目次、見出し、内部リンク、関連記事などが美しく構造化されて表示されています。
まとめ:ヘッドレスCMSは「AIの出力先」として最強である
「AIに記事を書かせる」までは多くの人がやっています。
しかし、「AIにCMSへ入稿させる」 ところまでやって初めて、業務自動化と言えます。
SanityのようなAPIファーストなヘッドレスCMSは、人間が使うためだけでなく、「AIエージェントが使いやすいデータベース」 としても非常に優秀です。
コピペ地獄から解放されたいエンジニアの皆さん、ぜひ Next.js × Sanity × n8n の構成を試してみてください。
🔗 著者情報
山本 勇志 (Yushi Yamamoto)
株式会社プロドウガ代表 / フルスタックエンジニア
「AIは育ててこそ、最強の参謀になる」。
自社メディア ibis を実験場に、AI×自動化の限界に挑戦中。
- X (Twitter): @UshiAiPro
- Company: PRODOUGA
- Media: ibis - Japan Living Guide
📢 開発・導入のご相談
「Sanityを導入したい」「AIによる自動入稿システムを構築したい」といったご相談を承っています。
XのDMまたはプロフィールリンクよりお気軽にご連絡ください。
