← All recipes
active // 開発 Self-reference

メディアサイト構築 — Cloudflare Pages で独立サブドメイン公開

自社 / 個人ブランドの独立メディアサイトを HubSpot CMS 等から切り離して Cloudflare Pages で公開する最短ルート (このサイト自身が実装例)

Last updated: 2026-04-30
メディアサイト構築 Astro Cloudflare Pages Claude Code Recipe
// Current best
Tools
  • Astro 5
  • Cloudflare Pages
  • Content Collections (zod schema)
  • 既存 DNS provider (Squarespace / Google Cloud DNS / 他)
Flow
  1. Astro project init (pnpm create astro)
  2. Content Collections schema 設計
  3. Component & route 実装
  4. wrangler login → wrangler pages project create → wrangler pages deploy
  5. Cloudflare Pages dashboard で Custom Domain 追加 → CNAME 指示を取得
  6. 既存 DNS provider で CNAME 追加 (subdomain → xxx.pages.dev)
  7. HubSpot Tracking & Analytics の Additional site domains に subdomain 登録
Time 1-2 日
Cost $0 (既存ドメイン利用、 Cloudflare Pages 無料 tier)
Notes

Registrar 移管は不要。 既存 DNS を維持しつつ Pages 用の CNAME を追加するだけで動く。 HubSpot subdomain tracking は portal-wide cookie 共有で自動連動する。

// Verified attempts
Claude Code (Opus 4.7) + Astro ADOPTED

現在稼働中 (このサイト自身)。 ロゴはテキスト仮版、 ロゴ生成版に差替え予定

Claude Design IN-PROGRESS

比較検証用に Claude Design でロゴ + トップページデザインを生成予定

GPT Image 2 + Codex 5.5 IN-PROGRESS

GPT Image 2 でロゴ、 Codex でフロントエンドコード生成、 という別パターンも検証予定

// Related artifacts
Archive items
// Learnings log
  • Squarespace registrar (¥1,400/年) は Cloudflare Registrar ($10.44/年) より安い、 移管しない判断
  • HubSpot tracking script は portal ID で発火、 サブドメイン登録の有無は無関係 (chat widget は CSS+JS で抑制が必要)
  • Astro Content Collections + zod schema で型安全、 entry 追加が 1 ファイル化
// Go deeper