- Cloudflare のグローバルネットワークと開発者プラットフォーム(Workers・ストレージ・AI)の全体像
- ユーザープロファイル・アカウント・ゾーンという 3 つの構造と、Free プランでできる範囲
- C3(
npm create cloudflare)と Wrangler CLI の役割分担とセットアップ wrangler loginによる認証と workers.dev サブドメインの仕組み- 最初の Worker プロジェクトを作成し、
wrangler devでローカル起動するまでの一連の流れ
Cloudflare の全体像 — グローバルネットワークと開発者プラットフォーム
Cloudflare は、世界中に配置されたサーバー群からなるグローバルネットワークです。インターネット上で最大級の規模を持ち、その上で SASE / SSE(Zero Trust)サービス、アプリケーションサービス、インフラストラクチャサービス、そして本書の主役である開発者プラットフォーム(Developer Platform)を提供しています。
Cloudflare の使い方は大きく 2 つに分けられます。
- Built with Cloudflare — 既存のアプリケーションを Cloudflare に追加すると、リクエストとオリジンサーバーの間に Cloudflare のネットワークが入り、CDN・DDoS 対策・WAF などで配信を高速化・保護します
- Built on Cloudflare — Cloudflare 自体をオリジンとしてアプリケーションを構築します。Workers でコードを動かし、ストレージ製品でデータを永続化する、本書が扱うスタイルです
開発者プラットフォームの中核が Cloudflare Workers です。サーバーレスコードを世界中のネットワークへ即座にデプロイできます。周辺には用途別のストレージ・データ製品が揃っており、本書の第 II 部以降で順に扱います。
| ユースケース | 製品 | 本書での登場 |
|---|---|---|
| キーバリューストレージ | Workers KV | 第 5 章 |
| オブジェクトストレージ | R2 | 第 6 章 |
| 軽量 SQL データベース | D1 | 第 7 章 |
| グローバル調整・ステートフルサーバーレス | Durable Objects | 第 8 章 |
| タスク処理・メッセージング | Queues | 第 9 章 |
| ベクトル検索 | Vectorize | 第 12 章 |
| サーバーレス GPU での AI 推論 | Workers AI | 第 11 章 |
このほか、フロントエンド配信(Workers Static Assets / Pages)、画像・動画配信(Images / Stream)などもプラットフォームに含まれます。
アカウントの構造と Free プランでできること
Cloudflare には設定の置き場所を決める 3 つの組織単位があります。
- ユーザープロファイル — ログインするあなた個人の設定(メールアドレス、言語、通知設定など)
- アカウント — 組織の単位。課金情報・メンバー・アカウントレベル製品を持ちます。Workers はアカウントレベルの製品で、1 ユーザーは複数アカウントに所属できます
- ゾーン — Cloudflare に追加したドメインの単位。DNS・キャッシュルールなどゾーンレベル製品はそのドメインだけに作用します
重要なのは、Workers の開発にゾーン(独自ドメイン)は必須ではないという点です。アカウントには workers.dev サブドメインが付属し、独自ドメインを持ち込まなくても Worker を公開できます(詳細は後述)。
Workers はデフォルトで Workers Free プランで利用でき、そのまま学習を始められます。主な上限は次のとおりです(2026-08 時点)。
| 項目 | Workers Free | Workers Paid($5 USD/月〜) |
|---|---|---|
| リクエスト数 | 100,000 件/日 | 1,000 万件/月 込み(超過 $0.30/100 万件) |
| CPU 時間 | 10 ミリ秒/呼び出し | 3,000 万 CPU ミリ秒/月 込み(最大 5 分/呼び出し) |
| メモリ | 128 MB | 128 MB |
| Worker サイズ(gzip 圧縮後) | 3 MB | 10 MB |
| Worker 数 | 100 個 | 500 個 |
| Cron Triggers | 5 個/アカウント | 250 個/アカウント |
静的アセットへのリクエストは無料・無制限です。また Free プランには Workers KV(読み取り 100,000 件/日、書き込み 1,000 件/日、保存 1 GB)や Hyperdrive の限定利用も含まれます(2026-08 時点)。本書のハンズオンは、有料機能を使う章で明示する場合を除き Free プランで完走できます。数値の最新版は Limits と Pricing を参照してください。
開発を支える 2 つの CLI — C3 と Wrangler
Cloudflare の開発者プラットフォームには 2 つのコマンドラインツールがあります。役割分担は明快です。
- C3(create-cloudflare CLI) — 新規プロジェクトの作成専用。
npm create cloudflare@latestで起動し、公式テンプレートやフレームワーク別セットアップに沿ってプロジェクトを生成します - Wrangler — 開発・デプロイ・管理の主役。ローカル開発サーバー(
wrangler dev)、デプロイ、ロールバック、リソース管理まで担います
Wrangler はグローバルではなくプロジェクトごとにローカルインストールするのが公式推奨です。チームで同じバージョンを共有でき、プロジェクト単位でバージョンを固定・ロールバックできるためです。C3 でプロジェクトを作ると Wrangler が自動的にインストールされるので、通常は改めて入れる必要はありません。実行は npx wrangler ... 形式を使います。
動作要件(2026-08 時点): Wrangler は Node.js の Current / Active / Maintenance リリースをサポートし、OS は macOS 13.5+、Windows 11、glibc 2.35 をサポートする Linux ディストリビューションが対象です。Node.js は権限問題の回避とバージョン切り替えのため、mise や nvm などのバージョンマネージャー経由でのインストールが推奨されています。
プロジェクトの設定は wrangler.jsonc(または wrangler.toml)に記述します。最小構成は次のような形です。
{
"$schema": "./node_modules/wrangler/config-schema.json",
"name": "my-first-worker",
"main": "src/index.js",
"compatibility_date": "2026-08-10"
}
name は Worker の名前で、後述する workers.dev の URL にもそのまま使われます。Wrangler を使うプロジェクトでは wrangler.jsonc を source of truth(正)として扱い、ダッシュボード側で設定を変更しないことが公式に推奨されています。両方で触ると設定が食い違い、事故のもとになります。本書は一貫して wrangler.jsonc を正とする CLI スタイルで進めます。
なお、インストールを一切せずブラウザだけで Workers を体験したい場合は Playground というサンドボックスもあります(認証不要。Chrome / Firefox デスクトップのみ対応)。
workers.dev サブドメイン — デプロイ先の URL を理解する
各アカウントに付属する workers.dev サブドメインは、独自ドメインなしで Worker を公開するための仕組みです。URL は次の形式になります。
https://<YOUR_WORKER_NAME>.<YOUR_ACCOUNT_SUBDOMAIN>.workers.dev
<YOUR_WORKER_NAME> には wrangler.jsonc の name フィールドが、<YOUR_ACCOUNT_SUBDOMAIN> にはこのあとのハンズオン 1-1 で確認するアカウントのサブドメインが入ります。Worker 名は DNS ラベルとして使われるため、63 文字以内・英数字とダッシュのみ・先頭と末尾のダッシュ不可という制約があります。
workers.dev 上の Worker は Free プランの Web サイトと同じ扱いで、個人・趣味プロジェクト向けです。本番運用ではルートまたはカスタムドメインの利用が推奨されています(第 2 章で扱います)。公開したくない場合は wrangler.jsonc に "workers_dev": false を書くか、Cloudflare Access で閲覧者を制限できます。
Cloudflare アカウントを作成し、Workers 開発で使う画面と情報の場所を確認します。所要時間は 10 分ほどです。
- サインアップページを開き、メールアドレスとパスワードを入力して Create Account を選択する
- 登録アドレスに届く確認メールを開き、メールアドレスを検証する(未検証だと一部のダッシュボード機能が使えません)
- ダッシュボードにログインし、Workers & Pages ページを開く。ここが Workers 開発のホーム画面になる
- 同ページの Account Details セクションでアカウント ID を確認する(API 操作で使う ID。任意のページで Cmd/Ctrl + K の検索から「Copy account ID」でもコピーできる)
- Your subdomain に表示される workers.dev サブドメインを確認する。変更したい場合は隣の Change から変更できる
アカウント名はデフォルトで「メールアドレス's Account」になります。Configurations ページの Account Name → Change Name から分かりやすい名前に変えておくと、複数アカウントを扱うときに迷いません。
C3 を使って Hello World の Worker プロジェクトを生成します。所要時間は 5〜10 分です。
- まず Node.js と npm が入っていることを確認する
node --version npm --version - ターミナルで C3 を実行してプロジェクトを作る
npm create cloudflare@latest -- my-first-worker - 対話プロンプトでは次を選択する
- What would you like to start with? →
Hello World example - Which template would you like to use? →
Worker only - Which language do you want to use? →
JavaScript(TypeScript も選択可。第 2 章から TypeScript に切り替えます) - Do you want to use git for version control? →
Yes - Do you want to deploy your application? →
No(デプロイは第 2 章で行います)
- What would you like to start with? →
- 生成されたプロジェクトへ移動する
cd my-first-worker
ディレクトリには wrangler.jsonc(Wrangler 設定)、src/index.js(ES Modules 形式の Hello World Worker)、package.json、package-lock.json、node_modules が生成されていれば成功です。
ローカル開発サーバーを起動し、初回ログイン認証とコード編集のサイクルを体験します。所要時間は 10 分ほどです。
- プロジェクトディレクトリでローカル開発サーバーを起動する
Wrangler を初めて使う場合はブラウザが自動で開くので、Cloudflare アカウントでログインして Wrangler の OAuth 認可を許可する(npx wrangler devwrangler loginが内部で実行される。デフォルトでは利用可能な全スコープが要求される) - ブラウザで
http://localhost:8787を開き、「Hello World!」が表示されることを確認する src/index.jsを開き、レスポンス文字列を書き換えて保存するexport default { async fetch(request, env, ctx) { return new Response("Hello Worker!"); }, };- ブラウザをリロードし、出力が「Hello Worker!」に変わることを確認する
- 別のターミナルで認証状態を確認する
npx wrangler whoamiYou are logged in with an OAuth Token, associated with the email ...のように表示されれば認証完了
wrangler dev はデフォルトで完全ローカル実行です。Worker コードは本番と同じオープンソースランタイム workerd 上(シミュレーターの Miniflare 経由)で動き、バインディング先のリソースもローカルにシミュレートされます。本番リソースに触れずに安心して試せる、これが今後全章で使う基本ループです。
wrangler dev のあいだ、Worker もバインディング先のリソースも点線の内側にしかありません。ランタイムは本番と同じ workerd なので挙動は再現されるのに本番のデータには一切触れず、点線を越える辺は破線の deploy 1 本だけです。つまずきポイント
ブラウザが開けない環境では、ターミナルに表示される OAuth URL を手動でブラウザに貼り付ければログインできます。SSH 先などリモートマシンの場合、手元のブラウザでログインすると「This site can't be reached」と表示されますが、これは想定内です。ログインフローを開いたまま、リモートマシン側の別ターミナルでリダイレクト先の localhost URL を curl すれば完了します。コンテナ内で実行する場合はコールバックサーバーのポート 8976 をホストへマッピングし、npx wrangler login --callback-host=0.0.0.0 を使います。
Wrangler がサポートするのは Node.js の Current / Active / Maintenance リリースです(2026-08 時点)。OS 標準のパッケージマネージャーで入れた古い Node.js で実行するとエラーになることがあります。mise や nvm などのバージョンマネージャーで最新 LTS に切り替えてください。バージョンマネージャー経由なら sudo なしでインストールでき、権限エラーも避けられます。
workers.dev サブドメインを有効にしたままデプロイする場合、Worker 名(name フィールド)は 63 文字以内・英数字とダッシュのみ・先頭末尾のダッシュ不可を満たす必要があります。日本語やアンダースコア入りの名前は使えません。長い名前が必要な場合は workers.dev を無効化すれば 255 文字まで使えます。
ダッシュボード側で workers.dev ルートを無効化しても、wrangler.jsonc に "workers_dev": false を書いていなければ、次に Wrangler でデプロイしたときに再度有効化されます。source of truth を wrangler.jsonc に決めたら、公開設定も必ず設定ファイル側に書きましょう。
理解度チェック
Q1. Workers Free プランの 1 日あたりリクエスト上限と、1 呼び出しあたりの CPU 時間上限は?(2026-08 時点)
リクエストは 100,000 件/日、CPU 時間は 10 ミリ秒/呼び出しです。日次上限を超えると Cloudflare は Error 1027 を返します(ルート設定によっては Worker を素通しさせる fail open も選べます)。継続時間(I/O 待ち時間)は課金・制限の対象ではなく、CPU を実際に使った時間だけが数えられる点がポイントです。
Q2. C3 と Wrangler の役割分担を説明してください。
C3(create-cloudflare CLI)は新規プロジェクトの作成専用ツールで、公式テンプレートからプロジェクトを生成し、Wrangler を自動インストールします。Wrangler はその後の開発・デプロイ・管理を担う CLI で、wrangler dev でのローカル開発、デプロイ、ロールバックなどを行います。
Q3. デプロイした Worker の workers.dev 上の URL はどのように決まりますか?
<Worker 名>.<アカウントのサブドメイン>.workers.dev という形式です。Worker 名には wrangler.jsonc の name フィールドが使われ、アカウントのサブドメインはダッシュボードの Workers & Pages ページで確認・変更できます。
Q4. wrangler dev を実行したとき、Worker コードとバインディング先のリソースはそれぞれどこで動きますか?
デフォルトではどちらもローカルです。Worker コードは本番と同じランタイム workerd を使うシミュレーターの Miniflare 上で実行され、KV や R2 などのバインディング先リソースもローカルにシミュレートされます。設定により本番リソースへ接続するリモートバインディングも選べます。
まとめと次章へ
- Cloudflare はグローバルネットワークであり、その上の開発者プラットフォーム(Workers + ストレージ + AI)を使うと Cloudflare 自体をオリジンとしてアプリを構築できる
- Workers はアカウントレベルの製品で、独自ドメインなしでも workers.dev サブドメインで公開できる。Free プランは 100,000 リクエスト/日・CPU 10 ms で学習には十分(2026-08 時点)
- C3 がプロジェクト作成、Wrangler が開発・デプロイを担当する。Wrangler はプロジェクトローカルにインストールし
npx wranglerで実行、設定は wrangler.jsonc を source of truth にする wrangler devはデフォルト完全ローカル実行。http://localhost:8787で確認し、保存 → リロードで反映される
次章では、今日作った Hello World の中身 — fetch ハンドラと Request / Response — を掘り下げ、wrangler deploy で世界に公開します。
参考リンク: