~/VibeHandbook
$39

Cloudflare

developers.cloudflare.com

Cloudflare Pages

概要

Cloudflare Pages は、ウェブサイトのためのホスティングプラットフォームです — 素の静的ファイルからフルスタックアプリまで。Git リポジトリを接続すると、Pages がビルドコマンドを実行し、その出力を Cloudflare の CDN から配信します。動的なルートや API は Pages Functions として動作し、その実体は Workers なので、1 つのプロジェクトが静的サイトとバックエンドの両方になり得ます。

強み

  • Git 駆動 — プッシュのたびにビルドとデプロイが行われ、ブランチごとにプレビュー URL が付きます。
  • 静的アセットはグローバル CDN から高速かつ無料で配信されます。
  • Pages Functions が、Workers と同じバインディング(D1、R2、KV)でサーバーサイドのロジックを追加します。
  • 寛大な無料枠と無制限の帯域幅。
  • ロールバックはワンクリック — すべてのデプロイが保持されます。

トレードオフ

  • ビルド環境には時間とリソースの上限があり、非常に大きなビルドは遅くなることがあります。
  • Functions は Workers ランタイムを継承するため、同じ非 Node の制約が適用されます。
  • 純粋に動的で常時稼働のバックエンドには、素の Workers のほうがすっきり収まる場合があります。
  • あまり一般的でないフレームワークのビルド設定は、ときに手動での調整が必要になります。

使うべきとき

Git ベースのデプロイ、無料の静的ホスティング、そしてオプションのサーバー関数を 1 か所で欲しいときに、マーケティングサイト、ドキュメント、ブログ、SPA、フルスタックフレームワーク(Next.js、Astro、SvelteKit)に Pages を使いましょう。

バイブコーディングとの相性

Pages はバイブコーディングに向いています。デプロイ全体が「リポジトリを接続してプッシュする」だけだからです。エージェントはビルドコマンド、出力ディレクトリ、環境変数を設定し、Wrangler でデプロイするか Git ビルドをトリガーできます。コツ — フレームワークと Functions が必要かどうかをエージェントに伝え、正しいアダプターと出力ディレクトリを選ばせましょう。ビルド済みのディレクトリを直接デプロイすることもできます。

# wrangler.toml — Pages project config
name = "my-site"
pages_build_output_dir = "dist"

[[d1_databases]]
binding = "DB"
database_name = "my-db"
database_id = "your-d1-id"
# Deploy a prebuilt output directory
npx wrangler pages deploy dist --project-name my-site