メインコンテンツへスキップ
見出し画像

【調査メモ】CloudflareとEmDash、私ならここを使う〜実装前に5つの使い道を図解で整理〜:会話動画付き

    ※この記事にはPR(アフィリエイトリンク)が含まれる場合があります。

    📌 この記事でわかること
    Cloudflareと、Cloudflare製のCMS「EmDash」について、実装に入る前の調査段階で「自分ならどこを使うか」を5つに整理しました。全部を乗り換える話ではなく、今の環境の足りないところにだけ足す、という考え方です。各図解の赤枠「私が使うのはここ」が、私が実際に使おうとしている部分です。

    はじめに

    最近、Cloudflareの名前をよく見かけるようになりました。CDNやDNSの会社というイメージが強かったのですが、今はサイトの置き場所、ファイル置き場、AIの呼び出し管理、さらにはCMSまでそろっています。

    特に気になっているのが、2026年4月に発表されたEmDashです。WordPressの「精神的後継」をうたうCMSで、9月末には1.0も発表されました。WordPressを20年以上使ってきた身としては、見過ごせません。

    とはいえ、いきなり全部を移すつもりはありません。今回は実装前の調査メモとして、私の環境のどこにCloudflareが合いそうかを図解で整理します。

    画像

    🎀 Erica「また筆者が新しいおもちゃを見つけてきたのね。でも今回は『まず調べるだけ』なんでしょ?えらいわ、ちゃんと我慢できてるじゃない」

    📝 全体像:5つの使い道マップ

    🔹 Cloudflareは「足りないところにだけ足す」

    画像

    最初に全体を見ておきます。私が使えそうだと思ったのは、次の5つです。

    ① EmDash(Cloudflare製のCMS)
    ② Pages / Workers(商用OKの無料ホスティング)
    ③ DNS・CDN・Turnstile(今のWordPressの前に置く)
    ④ R2(転送料ゼロのファイル置き場)
    ⑤ AI Gateway・Cron(AI案件の基盤)

    大事なのは、WordPressで動いているサイトはWordPressのままにしておくことです。今動いているものは動かしたまま、新しく作るものや、困っているところにだけCloudflareを使います。

    📝 使い道① EmDash:新しいアフィリエイト試験サイトで試す

    🔹 EmDashとは

    画像

    EmDashは、CloudflareがオープンソースのMITライセンスで公開したCMSです。TypeScriptとAstroで作られていて、Cloudflare Workersの上で動きます。データベースはD1、画像やファイルはR2、キャッシュはKVと、Cloudflareのサービスを組み合わせて使う作りです。

    WordPressとの大きな違いは2つあります。1つはプラグインがサンドボックスで隔離されていること。WordPressで一番多い「プラグインの穴から攻撃される」問題への答えになっています。もう1つは、MCPサーバーが最初から入っていることです。AIエージェントが記事の作成、編集、公開まで直接できるようになっています。

    🔹 私が使うのはここ

    今運営しているアフィリエイト用のLPサイトはWordPressのまま残し、EmDashはお試しとして、新しく普通のアフィリエイトサイトを立ち上げて使う予定です。

    一番確かめたいのは、内蔵のMCPサーバーです。ふだんClaude Codeに指示を出して開発しているので、Claude Codeから記事を直接入れられるなら、記事作成から公開までの流れがかなり変わります。WordPress歴の長い目で、管理画面の使い勝手も比べてみたいところです。

    📝 使い道② Pages / Workers:商用OKの無料ホスティング

    🔹 Vercelの「商用不可」がきっかけ

    画像

    これまでNext.jsのサイトはVercelに置いてきました。Next.jsとの相性は最高なのですが、無料のHobbyプランは商用利用ができません。広告やアフィリエイト、仕事の案件に使うなら、1人月20ドルのProプランが必要です。

    実際、アフィリエイトを貼るLPサイトは、商用利用のためにWordPressへ移しました。一方で、コーポレートサイトは今もVercelに独自ドメインをつけて動かしています。

    Cloudflare Pages / Workersは、無料プランでも商用利用ができます。静的ファイルの配信は無料で無制限、Workersは1日10万リクエストまで無料です。

    🔹 私が使うのはここ

    一番の候補は、今Vercelで動いているコーポレートサイトです。商談予約や受託開発の窓口にもなるサイトなので、商用利用の条件を気にせずに置ける場所に移せるかを調べます。

    これからNext.jsで作る多言語学習ブログもCloudflareに置く候補です。300本を超える過去のnote記事を自動で紹介していくローテーションブログも、そのあとに検討します。

    調べたいのは、Next.jsをCloudflareで動かす手順と、Vercelと比べたときのハマりどころです。

    📝 使い道③ DNS・CDN・Turnstile:今のWordPressの「前」に置く

    🔹 サーバーはそのまま、入口だけCloudflareへ

    画像

    アフィリエイト用のLPサイトは、レンタルサーバーのWordPressで動いています。この構成は変えずに、ドメインのネームサーバーの向き先をCloudflareにするだけで、訪問者とサーバーの間にCloudflareが入ります。

    それだけで、CDNのキャッシュで表示が速くなり、SSLやWAFで攻撃もブロックしてくれます。しかも基本の機能は無料です。

    🔹 私が使うのはここ

    実は、WordPressで運営しているサイトには、毎日のように攻撃が来ています。WordPressは世界中で使われている分、ボットが自動で探し出して、ログイン画面などを片っ端から試してくるのです。CloudflareのWAFを前に置けば、こうした攻撃をサーバーに届く前に止められます。

    LPサイトは、note記事から読者を案内するためのサイトでもあります。リンクを押してから表示までが遅いと、そこで読者が離れてしまうので、表示が速くなる効果も大きい場所です。

    もう1つはTurnstileです。CAPTCHAの代わりになる仕組みで、ロボットの送信を防いでくれます。Turnstileはサイト単体でも使えるので、LPサイトのお問い合わせフォームに加えて、Vercelで動いているコーポレートサイトの商談予約フォームにも付けたいと考えています。

    調べたいのは、WAFでどれだけ攻撃を止められるか、導入の前後で表示速度がどれだけ変わるか、そしてWordPressの管理画面やフォームがキャッシュのせいで壊れないかです。

    📝 使い道④ R2:転送料ゼロのファイル置き場

    🔹 何回ダウンロードされても転送料がかからない

    画像

    R2はファイルの保管場所です。無料枠は10GBで、一番の特徴は、外部への転送料がかからないことです。音声や動画のように、何度も再生・ダウンロードされるファイルに向いています。

    🔹 私が使うのはここ

    コーポレートサイトの読み上げ機能は、Google Cloud Text-to-Speechで音声を作っています。今はキャッシュなしなので、同じ文章でもボタンが押されるたびに音声を作り直しています。

    一度作った音声をR2に保存しておけば、2回目からはそのまま再生できて、TTSの料金がかかりません。ポッドキャスト動画の音声やmp4素材の保管場所としても使えそうです。

    📝 使い道⑤ AI Gateway・Cron:AI案件の基盤

    🔹 AIへの呼び出しを1か所に集める「関所」

    画像

    AI Gatewayは、ClaudeやOpenAIなどへの呼び出しを1か所にまとめる仕組みです。トークン数やコストの記録、同じ質問のキャッシュによる節約、回数制限、エラー時に別のモデルへ切り替える、といったことができます。

    Cron Triggersは、決まった時間に処理を動かす機能です。今はGASやMake.comでやっている定期処理の代わり候補になります。

    🔹 私が使うのはここ

    私の事業では、法人向けにAIエージェントの導入支援をしています。企業がAIを使い始めると、必ず「API代がいくらかかっているのか分からない」という不安が出てきます。AI Gatewayを間に入れれば、その「見える化」を提案メニューにできそうです。

    📝 まとめ:次にやること

    🔹 調査から実装へ

    5つの中で、最初に手を動かすのはEmDashです。新しいアフィリエイト試験サイトを立ち上げて、MCP経由でClaude Codeから記事を入れられるかを試してみます。そのあとに、③のDNS・CDNで、WordPressのLPサイトへの攻撃を止めつつ表示を速くできるかを確かめる予定です。

    実際に試した結果は、また記事にまとめます。

    🔹 参考リンク

    EmDashの発表(Cloudflare公式ブログ)
    https://blog.cloudflare.com/emdash-wordpress/

    EmDashのソースコード(GitHub)
    https://github.com/emdash-cms/emdash

    EmDash 1.0の発表内容(CMSWire)
    https://www.cmswire.com/digital-experience/cloudflare-releases-emdash-1-0-cms-with-decentralized-plugin-registry/

    Cloudflare Workersの料金(Cloudflare公式ドキュメント)
    https://developers.cloudflare.com/workers/platform/pricing/

    AI Gatewayの機能一覧(Cloudflare公式ドキュメント)
    https://developers.cloudflare.com/ai-gateway/features/

    Claude Code×Cloudflareの自動化セット「ClaudeFlare」(GitHub)
    https://github.com/dhannusch/ClaudeFlare

    おわりに

    調べてみて分かったのは、Cloudflareは「全部乗り換える」ものではなく、「足りないところにだけ足す」使い方ができることでした。WordPressもVercelも、今まで作ってきたものは無駄になりません。

    画像

    🎀 Erica「結局5個も使う気なのね。『調べるだけ』って言ってたの、どこいったのよ。まあいいわ、EmDashの結果は私が最初にチェックしてあげる」
    ビデオポッドキャスト(会話動画)

    ビデオポッドキャスト(ショート動画)

    1,000円ポッキリのお試し動画作成の期間限定キャンペーン好評開催中!

    最後までお読みくださり、ありがとうございます!
    私は京都生まれ大阪育ちなので、記事では結構ボケているつもりです。お好きな記事のコメント欄にツッコミ、お待ちしています😊


    あなたへのおすすめ