管理画面から記事を更新するCMSというとWordPressをイメージする方が多いと思いますが、今の時代のCMSのスタンダードになる可能性も秘めているとして話題となっているのがEmDash（エムダッシュ）です。
Cloudflareが開発したCMSで、自らが「WordPressの精神的後継」と謳っています。
WordPressとどう違うのか、何が新しいのか、気になることがたくさんあると思いますが、百聞は一見にしかず。細かい理屈は置いておいて、まずは導入して公開するまでを手を動かしながら確認してみましょう！
Step1：サイトを置くためのフォルダを作ろう
まず、空のフォルダを1つ作ります。
名前は何でもいいです。ここでは my-emdash-site にしました。
作ったフォルダを、VS Codeで開きます。あとの作業は全部この中で終わります。
まだ中身は空っぽです。
Step2：事前準備としてNode.jsをインストールしよう
用意するのはこれだけです。VS Codeのターミナル（メニューの「表示」→「ターミナル」で開きます）で、入っているか確かめます。
node --version
v22.23.4以上が出ればOKです。入っていなければ公式サイトからインストールしてください。
Step3：EmDashを自分のパソコンにインストールしよう
さきほどのフォルダで、これだけ。
npm create emdash@latest .最後の . は「いま開いているフォルダの直下に入れる」という意味になります。付けないと、いまのフォルダの中にもう1つフォルダが作られてしまいます。
対話形式でいくつか聞かれます。
聞かれたのは5つで、今回は以下のように答えています。
| 聞かれたこと | 答えたこと |
|---|---|
| どこにデプロイするか | Cloudflare Workers |
| テンプレート | Blog |
| パッケージマネージャ | npm |
| 依存関係を入れるか | Yes |
| サンドボックスプラグインを使うか | No |
最後の「サンドボックスプラグイン」は画面にも出ていますが、これを有効にするとWorkersの有料プランが必要になります。まずは無料で動作を確認したいので、ひとまずはNoのままにします。
そのまま起動します。
npm run devデフォルトだと http://localhost:4321/ で、いまの画面を見ることができます。
もうサイトとして動いています。記事を書く管理画面は http://localhost:4321/_emdash/admin です。
Step4：Cloudflareにアップ（デプロイ）しよう
ここからがCloudflareと繋いで公開する作業になります。
EmDashの場合はレンタルサーバーではなく、Cloudflareを使います。WordPressでいうとレンタルサーバーを契約するところですが、こちらは契約も月額も発生しません。
アカウント作成
持っていない方は、まずはCloudflareのアカウントを作りましょう。アカウントは無料で作れます。
https://dash.cloudflare.com/sign-up
メールアドレスとパスワードを入れるか、Googleアカウントでもそのまま作れます。
クレジットカード登録
1つだけ注意があります。画像の置き場（R2）だけはクレジットカードの登録が必要です。
| カード登録 | |
|---|---|
| Workers（サイト本体） | 不要 |
| D1（データベース） | 不要 |
| R2（画像の置き場） | 必要 |
無料枠に収まっていても、使い始めるときに登録の手続きだけは求められます。場所はダッシュボードの Storage & databases → R2 → Overview です。
登録しても、無料枠の中なら請求は来ません。ここで済ませておくと、このあとで止まりません。
wrangler.jsonc
Cloudflareに出すための設定が、wrangler.jsonc に書かれています。
{
"name": "my-emdash-site",
"d1_databases": [
{ "binding": "DB", "database_name": "my-emdash-site" }
],
"r2_buckets": [
{ "binding": "MEDIA", "bucket_name": "my-emdash-media" }
]
}name / database_name / bucket_name は変えていいところで、そのままCloudflare上での名前になります。
とくに name はURLになります。
my-emdash-site.<アカウントのサブドメイン>.workers.devここはフォルダ名とは連動しません。2つ目のサイトを作るときは、ここを変えてからCloudflareにデプロイしてください。同じ名前のままだと、1つ目と同じ場所に上書きされます。
Cloudflareにアップ（デプロイ）
Cloudflareにログインします。ブラウザが開いて承認するだけです。
npx wrangler login承認するとこの画面になります。
ここまで来たらブラウザは閉じて大丈夫です。
あとはデプロイするだけ。
npm run deploy
データベースも画像の置き場も、このとき勝手に作られます。先に用意しておく必要はありません。ログの bindings の欄が、作られたものの一覧です。
| 作られたもの | |
|---|---|
| D1 Database | データベース |
| R2 Bucket | 画像の置き場 |
| KV Namespace | ログイン状態の保存 |
| Images | 画像のリサイズ |
| Assets | CSSや画像などの配信 |
最後に workers.dev のURLが出ます。これがサイトのアドレスです。
Step5：EmDashのサイトを確認しよう
出てきたURLを開くと、セットアップの画面が出ます。サイト → アカウント → ログインの3ステップです。
サイト名を決めたら、次はアカウントです。
そして最後がログイン方法です。
パスワードではなくパスキーです。覚えるパスワードはありません。
無料プランではメールが送れないので、事実上パスキー一択になります。なくすとログインできなくなるので、iCloudキーチェーンなど同期される場所に保存しておくのが安心です。
パスキーを作ると、ダッシュボードが開きます。
サンプルの記事が7本入った状態で、すぐ書き始められます。
おわりに
フォルダを1つ作るところから、公開されたURLで管理画面が開くところまで。コマンドを中心に、CMS環境がひととおり出来上がりました。サーバーの契約も、データベースを作る作業もありません。
実際にデザインを整えたり、管理画面をカスタマイズしたりする場合は、ここから作業が発生します。ただ、立ち上げるまではめちゃくちゃ簡単にできることは、イメージしていただけたかと思います。
EmDashは今後スタンダードになる可能性のあるCMSです。状況に応じて選択できるように、今のうちに触っておきましょう！
