作ったものを世界に公開する ── Cloudflare Pages / Vercel / Netlifyの使い方

「公開する」とは

ローカル（自分のPC）で作ったサイトは、自分しか見られない。インターネット上のサーバーに置くことで、世界中の誰でもアクセスできるようになる。

これを**デプロイ（公開）**と呼ぶ。

---

3つの無料ホスティングサービス

サービス	特徴	おすすめ度
Cloudflare Pages	最速、帯域無制限、独自ドメイン無料	最もおすすめ
Vercel	Next.js公式、使いやすいUI	React/Next.jsなら
Netlify	老舗、機能豊富	フォーム機能が必要なら

どれを選ぶ？

• Astroで作った → Cloudflare Pages
• Next.jsで作った → Vercel
• 迷ったら → Cloudflare Pages（最も制限が緩い）

---

Cloudflare Pagesでのデプロイ手順

Step 1: GitHubにpush

git init
git add .
git commit -m "Initial commit"

GitHubでリポジトリを作成して：

git remote add origin https://github.com/ユーザー名/リポジトリ名.git
git push -u origin main

Step 2: Cloudflare Pagesに接続

1. Cloudflare Dashboard にログイン
2. Workers & Pages → Create
3. 「Looking to deploy Pages? Get started」 をクリック
4. GitHubアカウントを連携 → リポジトリを選択
5. ビルド設定:
   • Framework preset: Astro（使っているフレームワーク）
   • Build command: npm run build
   • Build output directory: dist
6. Save and Deploy

Step 3: 完了

数分でデプロイが完了し、プロジェクト名.pages.dev というURLが発行される。

---

独自ドメインを設定する

pages.dev のURLでもいいが、独自ドメイン（example.com）を設定すると本格的になる。

1. ドメインを取得（エックスサーバー、お名前.comなど）
2. Cloudflareにドメインを追加
3. ネームサーバーをCloudflareに変更
4. Pages → Custom domains で紐付け

全て無料（ドメイン代のみ年1,000円程度）。

---

デプロイ後にやること

やること	理由
Google Search Console登録	検索エンジンに認識させる
サイトマップ送信	全ページをGoogleに伝える
OGP画像の確認	SNSシェア時の見え方
モバイル表示の確認	スマホでの見え方

---

まとめ

コードを書く → GitHubにpush → 自動で公開

この流れが一度できれば、何サイトでも同じ手順で公開できる。最初は手間に感じるが、2サイト目以降は5分で終わる。