ハンズオン：AIとブログを作って公開する

本サイトの補足

注意

生成AIを使う前に知っておくこと

AIの回答が、古い仕様に基づくことがあります。EmDashは2026年4月に公開され、更新が速いためです。たとえば、廃止方向の Marketplace、旧形式の権限名 read:content、旧パッケージ名 @emdash-cms/registry-cli をAIが案内することがあります。
AIツールに公式のDocs MCP（https://docs.emdashcms.com/mcp）を接続すると、最新の公式ドキュメントを参照させられます。接続方法は「生成AIと一緒に進める準備」と「AIツール向けDocs MCP」で説明しています。
公式テンプレートには、AI向けの指示ファイル AGENTS.md と、Docs MCPの設定ファイル（.mcp.json、.cursor/mcp.json、.vscode/mcp.json）が最初から入っています。このハンズオンもテンプレートから始めます。

完成するもの

自分のパソコンで動くEmDashのブログ（公式のブログテンプレートのCloudflare版）
管理画面で書いて公開した1件の投稿
Cloudflare Workersにデプロイされ、workers.dev のURLで表示されるブログ

ブログテンプレートには、投稿、固定ページ、執筆者、カテゴリー、タグ、検索、コメント、ウィジェット、RSSフィードが入っています。（公式「ブログを作る」）

所要時間

目安：60分

AIエージェントによる実測のあとに、この時間を更新します。

必要なもの

種類	必要なもの	使う場面
ツール	Node.js 22.16以上	すべてのステップ
ツール	pnpm	すべてのステップ
ツール	ターミナル	コマンドの実行
ツール	パスキーを登録できるブラウザ	管理画面の初期設定
ツール	生成AIツール	ターミナルでコマンドを実行できるAIツール（Claude Code、Cursor、Codexなど）、またはチャット型のAI（ChatGPT、Claudeのチャットなど）。使い方の違いは「依頼文の使い方」で説明します
アカウント	Cloudflareアカウント	ステップ6以降（デプロイ）だけ

ローカルで開発している間は、データベースとファイル置き場のローカル版が自分のパソコンで動きます。Cloudflareアカウントが必要になるのはデプロイのときだけです。（公式「ブログを作る」）

テンプレートの選び方

公式ドキュメントには、始め方が2つあります。

公式ページ	テンプレート	作成コマンドの指定	データベースとファイル置き場
はじめてのEmDashサイト作成	Starter（Node.js版）	`--template node:starter --pm npm`	SQLiteとローカルのメディアストレージ
ブログを作る	ブログ（Cloudflare版）	`--template cloudflare:blog --pm pnpm`	ローカル開発中はローカル版、デプロイ後はD1とR2

このハンズオンはCloudflareへのデプロイまで進めるため、公式「ブログを作る」が使うブログテンプレートのCloudflare版を使います。公式「Cloudflareへのデプロイ」も、EmDashのCloudflare用テンプレートから始める手順です。管理画面の初期設定と「変更を公開する」の操作は、公式「はじめてのEmDashサイト作成」の手順に沿って確認します。

手順の全体像

図のテキストを読む

flowchart TD
    S0["0. Node.jsとpnpmを確認"] --> S1["1. ブログの雛形を作る"]
    S1 --> S2["2. 開発サーバーを起動"]
    S2 --> S3["3. 管理画面の初期設定"]
    S3 --> S4["4. 最初の投稿を公開"]
    S4 --> S5["5. 投稿ページとRSSを確認"]
    S5 --> S6["6. Cloudflareにログイン"]
    S6 --> S7["7. ビルドしてデプロイ"]
    S7 --> S8["8. デプロイ先を確認"]

ステップ0〜5は自分のパソコンの中だけで進みます。ステップ6からCloudflareを使います。

依頼文の使い方

依頼文は、そのままコピーしてAIに貼り付けられる形にしています。
AIツールによって、コマンドを実行する人が違います。依頼文はどちらの種類でも同じ文面で使えます。
- ターミナルでコマンドを実行できるAIツール（Claude Code、Cursor、Codexなど）：依頼文を渡すと、AIがコマンドを実行します。
- チャット型のAI（ChatGPT、Claudeのチャットなど）：AIが示したコマンドを、自分でターミナルに貼って実行します。
どの依頼文にも「公式ドキュメントの現在の内容を確認してから答える」指示を入れています。AIが古い仕様で答えるのを防ぐためです。

ステップ

ステップ0：Node.jsとpnpmを確認する

node --version でNode.jsのバージョンを確認します。pnpmは公式「ブログを作る」の前提条件です。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：EmDashのブログを作る前に、Node.jsとpnpmの条件を満たしているか確かめる

依頼文

EmDashの公式ドキュメント「Create a Blog」
（https://docs.emdashcms.com/guides/create-a-blog/）の前提条件を
自分のパソコンが満たしているか確認したいです。

条件：
・Node.jsは22.16以上を使う（「Create your first EmDash site」
　https://docs.emdashcms.com/getting-started/ の条件）
・パッケージマネージャーはpnpmを使う
・確認に使うコマンドを1つずつ示し、実行する前に何をするコマンドかを説明する
・インストールやバージョン変更が必要な場合は、実行する前に知らせる

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

node --version

公式ドキュメントでは、このコマンドの結果が v22.16.0 以降のバージョンであることを条件にしています。

自分で確認すること

node --version の結果が v22.16.0 以降になっている
pnpmのバージョンを表示するコマンドが、エラーにならずにバージョン番号を返す

対応する公式ページ：はじめてのEmDashサイト作成（前提条件）、ブログを作る（前提条件）

ステップ1：ブログの雛形を作る

ブログテンプレートのCloudflare版から my-blog を作り、pnpmで依存パッケージをインストールします。作成ツールは、EMDASH_ENCRYPTION_KEY を書き込んだ .env ファイルも作ります。.env は、生成される .gitignore によってGitの管理対象から除外されます。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：公式のブログテンプレート（Cloudflare版）から、ブログの雛形を作る

依頼文

EmDashの公式ドキュメント「Create a Blog」
（https://docs.emdashcms.com/guides/create-a-blog/）の「Scaffold the blog」の手順で、
ブログの雛形を作りたいです。

条件：
・テンプレートは cloudflare:blog、パッケージマネージャーは pnpm を使う
・プロジェクト名は my-blog にする
・公式ドキュメントに書かれているコマンドをそのまま使い、オプションを変えない
・実行する前に、そのコマンドが何をするかを説明する
・.env ファイルの中身は表示しない

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれている作成コマンドは次のとおりです。

npm create emdash@latest my-blog -- --template cloudflare:blog --pm pnpm --yes

自分で確認すること

my-blog というディレクトリができている
my-blog の中に .env ファイルがある（中身をAIに送らない）
依存パッケージのインストールに失敗したと表示された場合は、my-blog に移動して pnpm install を実行してから次に進む

対応する公式ページ：ブログを作る（ブログの雛形を作る）

ステップ2：開発サーバーを起動する

プロジェクトのディレクトリに移動し、開発サーバーを起動します。ターミナルに表示されたローカルのURLを開き、続けて /_emdash/admin を開きます。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：ブログを自分のパソコンで動かし、管理画面を開く

依頼文

EmDashの公式ドキュメント「Create a Blog」
（https://docs.emdashcms.com/guides/create-a-blog/）の手順に従って、
my-blog の開発サーバーを起動したいです。

条件：
・pnpm を使う
・開発サーバーを起動したターミナルは閉じずに、そのまま使い続ける
・起動後に開くURL（サイトと管理画面）を教える

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれているコマンドは次のとおりです。

cd my-blog
pnpm dev

ターミナルにローカルのサイトのURLが表示されます。通常は http://localhost:4321/ です。（公式「はじめてのEmDashサイト作成」）

自分で確認すること

ターミナルに表示されたURLをブラウザで開くと、ブログが表示される
同じURLの末尾に /_emdash/admin を付けて開くと、初期設定の画面が表示される

対応する公式ページ：ブログを作る（ブログの雛形を作る）、はじめてのEmDashサイト作成（サイトの雛形を作る）

ステップ3：管理画面の初期設定を完了する

初めて管理画面を開くと、セットアップウィザードが表示されます。テンプレートのシードデータ（seed/seed.json）から、コンテンツモデルとサンプルコンテンツが作られます。最初に作ったユーザーは、必ず管理者になります。（公式「ブログを作る」「認証」）

「サイトをセットアップ」で「サイトタイトル」と、必要に応じて「キャッチフレーズ」を入力します。「サンプルコンテンツを含める（新しいサイトに推奨）」は選択したままにして、「続行」を選択します。
「アカウントを作成」で「メールアドレス」と、必要に応じて「名前」を入力し、「続行」を選択します。
「アカウントを保護」で、ブラウザに認証情報の確認画面が表示されたらパスキーを登録します。登録が終わったら「Open the dashboard」を選択します。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：セットアップウィザードの各画面で何を入力するかを確かめる

依頼文

EmDashの管理画面（http://localhost:4321/_emdash/admin）を初めて開き、
セットアップウィザードが表示されています。
公式ドキュメント「Create your first EmDash site」
（https://docs.emdashcms.com/getting-started/）の「Complete setup」と、
「Authentication」（https://docs.emdashcms.com/guides/authentication/）の
「Set up the first user」に沿って、各画面で何を入力・選択するかを教えてください。

条件：
・管理画面は日本語で表示されている。ボタン名は画面の表示に合わせて案内する
・パスキーとは何かを1〜2文で説明する
・パスワードや秘密の値を、AIに送る必要がある手順は案内しない

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれている完了後の画面は次のとおりです。ダッシュボードが開き、ナビゲーションにコレクションが表示されます。（公式「はじめてのEmDashサイト作成」）

自分で確認すること

ダッシュボードが開いている
ナビゲーションに「Posts」と「Pages」が表示されている

対応する公式ページ：はじめてのEmDashサイト作成（初期設定を完了する）、認証（最初のユーザーを設定する）

ステップ4：最初の投稿を公開する

管理画面で投稿を1件作り、下書きとして保存してから公開します。

管理画面のサイドバーで「Posts」を選択し、「新規追加」を選択します。
タイトルを入力します。EmDashがタイトルからスラッグを提案します。公開URLを変えたい場合は編集します。
抜粋を入力し、「Content」のエディターで本文を書きます。
メディアライブラリからアイキャッチ画像を選択するか、アップロードします。記事の中での画像の役割を説明する代替テキストを入力します。
設定パネルで、バイライン、カテゴリー、必要なタグを割り当てます。
「保存」を選択します。エントリーは下書きになり、エディターはそのエントリーの固定のURLで開き直します。
「プレビュー」を選択して投稿ページを確認します。エディターに戻り、下書きの準備ができたら「公開」を選択します。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：投稿の作成から公開までの操作を、画面を見ながら確かめる

依頼文

EmDashのブログテンプレートで、最初の投稿を公開したいです。
公式ドキュメント「Create a Blog」
（https://docs.emdashcms.com/guides/create-a-blog/）の「Publish the first post」に沿って、
操作を1つずつ案内してください。

条件：
・管理画面は日本語で表示されている。ボタン名は画面の表示に合わせて案内する
・「スラッグ」「抜粋」「代替テキスト」「バイライン」の意味を、それぞれ1文で説明する
・「保存」と「公開」の違いを説明する

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれている結果は次のとおりです。「保存」を選択するとエントリーは下書きになり、「公開」を選択すると公開されます。公開したあとの編集は新しい下書きに自動保存され、公開中の投稿はそのまま表示され続けます。変更を反映するときは「Publish changes」を選択します。（公式「ブログを作る」）

自分で確認すること

エディターの状態表示が「公開済み」になっている（「下書き」や「予約済み」ではない）

対応する公式ページ：ブログを作る（最初の投稿を公開する）、コンテンツの作成と公開

ステップ5：投稿ページとRSSフィードを確認する

公開した投稿は、投稿ページ、トップページ、投稿一覧に表示されます。テンプレートは /rss.xml でRSSフィードも配信しています。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：公開した投稿が、サイトのどのURLに表示されるかを確かめる

依頼文

EmDashのブログテンプレートで投稿を1件公開しました。スラッグは「（ここに自分の投稿のスラッグを書く）」です。
公式ドキュメント「Create a Blog」
（https://docs.emdashcms.com/guides/create-a-blog/）に沿って、
この投稿が表示されるはずのURLと、RSSフィードの確認方法を教えてください。

条件：
・ローカルのサイトは http://localhost:4321/ で動いている
・表示されない場合に最初に確認することも、公式ドキュメントの記述の範囲で教える

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれている確認先は次のとおりです。

投稿ページ：/posts/your-post-slug（your-post-slug は自分の投稿のスラッグ）
トップページと投稿一覧
RSSフィード：/rss.xml

自分で確認すること

http://localhost:4321/posts/（自分の投稿のスラッグ） を開くと、投稿が表示される
トップページに投稿のタイトルが表示される
http://localhost:4321/rss.xml を開き、投稿のタイトルが含まれている

対応する公式ページ：ブログを作る（最初の投稿を公開する／RSSフィードを確認する）

ステップ6：Cloudflareにログインする

デプロイの前に、WranglerをCloudflareアカウントで認証します。公式「Cloudflareへのデプロイ」の前提条件は、Cloudflareアカウント、依存パッケージのインストール済みのプロジェクト、Cloudflareで認証済みのWranglerの3つです。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：デプロイに使うWranglerを、自分のCloudflareアカウントで使えるようにする

依頼文

EmDashの公式ドキュメント「Deploy to Cloudflare」
（https://docs.emdashcms.com/deployment/cloudflare/）の「Prerequisites」に沿って、
my-blog のディレクトリでWranglerをCloudflareアカウントで認証したいです。

条件：
・pnpm を使う
・公式ドキュメントに書かれているコマンドを使う
・ブラウザでの操作が必要になる場合は、その時点で知らせる
・APIトークンやパスワードなどの秘密の値を、AIに送る手順は案内しない

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれているコマンドは次のとおりです。

pnpm wrangler login

自分で確認すること

コマンドがエラーで終わっていない

対応する公式ページ：Cloudflareへのデプロイ（前提条件）

ステップ7：ビルドしてデプロイする

ビルドとデプロイを1回実行します。初回のデプロイで、Wranglerは wrangler.jsonc に書かれた名前のD1データベースとR2バケットを作ります。以降のデプロイは、同じリソースにつながります。wrangler.jsonc の名前は変えずに使います。（公式「Cloudflareへのデプロイ」）

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：ブログをCloudflare Workersにデプロイする

依頼文

EmDashの公式ドキュメント「Deploy to Cloudflare」
（https://docs.emdashcms.com/deployment/cloudflare/）の「Build and deploy」に沿って、
my-blog をCloudflare Workersにデプロイしたいです。

条件：
・pnpm を使う
・wrangler.jsonc のD1データベース名とR2バケット名は変更しない
・カスタムドメイン、プレビュー環境、Workers Cacheの設定はしない
・実行する前に、各コマンドが何をするかを説明する
・デプロイの結果として表示されるURLを教える

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれているコマンドは次のとおりです。

pnpm build
pnpm wrangler deploy

最初のデプロイでは、workers.dev のURLが割り当てられます。（公式「Cloudflareへのデプロイ」）

自分で確認すること

pnpm build と pnpm wrangler deploy がエラーで終わっていない
デプロイ先の workers.dev のURLが表示されている

対応する公式ページ：Cloudflareへのデプロイ（ビルドとデプロイ）

ステップ8：デプロイ先を確認する

公式「Cloudflareへのデプロイ」は、デプロイ後に次の4つを確認するよう説明しています。公開ページを1つ開く、/_emdash/admin にログインする、テスト用のメディアファイルをアップロードして取得する、スケジュール処理が pnpm wrangler tail に表示されることを確認する、の4つです。

デプロイ先は、ローカルとは別のデータベースです。管理画面に初めてアクセスすると、セットアップウィザードで管理者アカウントを作成します。パスキーはドメインごとに登録します。localhost:4321 用に登録したパスキーは、ほかのドメインでは使えません。（公式「認証」）

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：デプロイしたブログが動いているかを、公式の確認項目どおりに確かめる

依頼文

EmDashのブログを、Cloudflare Workersにデプロイしました。URLは「（ここに workers.dev のURLを書く）」です。
公式ドキュメント「Deploy to Cloudflare」
（https://docs.emdashcms.com/deployment/cloudflare/）の「Verify the deployment」に沿って、
動作確認の手順を1つずつ案内してください。

条件：
・pnpm を使う
・管理画面へのログインは、公式ドキュメント「Authentication」
　（https://docs.emdashcms.com/guides/authentication/）の説明に沿って案内する
・ローカルで登録したパスキーがデプロイ先で使えるかどうかも、公式ドキュメントの記述で答える

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

AIが出す結果の例

公式ドキュメントに書かれている確認用のコマンドは次のとおりです。

pnpm wrangler tail

自分で確認すること

workers.dev のURLでブログのトップページが表示される
/_emdash/admin にログインできる
テスト用の画像をアップロードでき、アップロードした画像を表示できる
pnpm wrangler tail の出力にスケジュール処理が表示される

対応する公式ページ：Cloudflareへのデプロイ（デプロイを確認する）、認証

うまくいかないときの確認点

症状	確認すること	公式ページ
雛形の作成で、依存パッケージのインストールに失敗したと表示される	プロジェクトのディレクトリに移動して `pnpm install` を実行してから先に進みます	ブログを作る
公開したはずの投稿がサイトに表示されない	エディターの状態表示が「公開済み」になっているかを確認します。「下書き」や「予約済み」では表示されません	ブログを作る
ローカルで書いた投稿がデプロイ先にない	ローカルの開発用データベースの投稿は、デプロイしても本番にコピーされません	ブログを作る
デプロイ先で「D1 binding not found」と表示される	`wrangler.jsonc` のバインディング名と、`astro.config.mjs` の `d1({ binding: "DB" })` の名前が一致しているかを確認します	Cloudflareへのデプロイ（トラブルシューティング）
デプロイ先で「R2 binding not found」と表示される	`wrangler.jsonc` のバインディング名と、`r2({ binding: "MEDIA" })` の名前が一致しているかを確認します	Cloudflareへのデプロイ（トラブルシューティング）
ビルド時に `[emdash] Sandboxed plugins are disabled because wrangler.jsonc has no LOADER Worker Loader binding` と表示される	Workersの無料プランでは想定どおりの表示です。サンドボックス型プラグインを使う場合は、Workersの有料プランで `LOADER` のバインディングを有効にしてビルドし直します	プラグインサンドボックス（トラブルシューティング）
デプロイ先でスキーマのエラーが出る	`wrangler tail` でWorkerのログを表示しながらエラーを再現し、元のメッセージを記録します。そのうえで、その出力を添えてissueを登録します	Cloudflareへのデプロイ（トラブルシューティング）
デプロイ先の管理画面で「Passkey authentication failed」と表示される	パスキーはドメインごとに登録します。デプロイ先のドメイン用に新しいパスキーを登録します	認証（トラブルシューティング）

このほかの症状は「つまずきやすいポイント」にまとめています。

本サイトの補足 · AIへの依頼文

AIに聞いてみよう

目的：手順の途中で出たエラーの原因を、公式ドキュメントの範囲で調べる

依頼文

EmDashの公式ドキュメント「（ここに今進めている公式ページのURLを書く）」の手順を進めていたところ、
次のエラーが出ました。公式ドキュメントに書かれている原因と対処を教えてください。

【実行したコマンドまたは操作】
（ここに書く）

【表示されたメッセージ】
（ここにそのまま貼る。APIトークン、パスワード、.env の中身は貼らない）

条件：
・公式ドキュメントに対処が書かれていない場合は、推測で対処を作らず「記載なし」と答える
・回答の根拠にした公式ページのURLを示す

回答する前に、必ず公式ドキュメントの現在の内容を確認してください。
EmDash Docs MCP（https://docs.emdashcms.com/mcp）が使える場合は、それで確認してください。

自分で確認すること

AIが示した公式ページを開き、同じ内容が書かれている

根拠にした公式ページ

はじめてのEmDashサイト作成：https://docs.emdashcms.com/getting-started/
ブログを作る：https://docs.emdashcms.com/guides/create-a-blog/
Cloudflareへのデプロイ：https://docs.emdashcms.com/deployment/cloudflare/
認証：https://docs.emdashcms.com/guides/authentication/
AIツール向けDocs MCP：https://docs.emdashcms.com/docs-mcp/
プラグインサンドボックス：https://docs.emdashcms.com/deployment/plugin-sandbox/

完成するもの

所要時間

必要なもの

テンプレートの選び方

手順の全体像

依頼文の使い方

ステップ

ステップ0：Node.jsとpnpmを確認する

ステップ1：ブログの雛形を作る

ステップ2：開発サーバーを起動する

ステップ3：管理画面の初期設定を完了する

ステップ4：最初の投稿を公開する

ステップ5：投稿ページとRSSフィードを確認する

ステップ6：Cloudflareにログインする

ステップ7：ビルドしてデプロイする

ステップ8：デプロイ先を確認する

うまくいかないときの確認点

根拠にした公式ページ

次に読むページ