クラウドサービス

Vercel（Next.jsに最適）

VercelはNext.jsの開発元が提供するホスティングプラットフォームです。 Next.jsとの相性が抜群で、GitHubリポジトリと連携するだけで自動デプロイが完了します。

• ゼロ設定デプロイ — GitHubにpushするだけで自動ビルド・デプロイ
• プレビューデプロイ — PRごとに独立したプレビューURLを自動生成
• Edge Network — 世界中のCDNで高速配信
• サーバーレス関数 — APIルートが自動的にサーバーレスで動作
• 自動HTTPS — SSL証明書の自動発行・更新

# Vercel CLIでのデプロイ
npm i -g vercel

# 初回セットアップ（対話式で設定）
vercel

# 本番デプロイ
vercel --prod

# 環境変数の設定
vercel env add DATABASE_URL production
vercel env add NEXT_PUBLIC_API_URL production

# プロジェクト設定の確認
vercel project ls

// vercel.json（オプション：カスタム設定）
{
  "buildCommand": "npm run build",
  "outputDirectory": ".next",
  "framework": "nextjs",
  "regions": ["hnd1"],  // 東京リージョン
  "headers": [
    {
      "source": "/api/(.*)",
      "headers": [
        { "key": "Cache-Control", "value": "no-store" }
      ]
    }
  ],
  "redirects": [
    { "source": "/old-page", "destination": "/new-page", "permanent": true }
  ]
}

AWS（Amazon Web Services）

AWSは世界最大のクラウドプラットフォームで、200以上のサービスを提供しています。 Web開発でよく使う主要サービスを紹介します。

# AWS CLIの基本操作例

# S3にファイルをアップロード
aws s3 cp ./build s3://my-bucket/ --recursive

# S3バケットの静的サイトホスティング設定
aws s3 website s3://my-bucket/ \
  --index-document index.html \
  --error-document 404.html

# Lambda関数のデプロイ
aws lambda update-function-code \
  --function-name my-api \
  --zip-file fileb://function.zip

# EC2インスタンスの一覧
aws ec2 describe-instances \
  --query "Reservations[*].Instances[*].[InstanceId,State.Name]" \
  --output table

GCP（Google Cloud Platform）

GCPはGoogleが提供するクラウドプラットフォームです。 データ分析やML/AIに強みがあり、Firebase統合でフロントエンド開発との相性も良いです。

# Cloud RunにDockerコンテナをデプロイ

# イメージをビルドしてArtifact Registryにプッシュ
gcloud builds submit --tag gcr.io/my-project/my-app

# Cloud Runにデプロイ
gcloud run deploy my-app \
  --image gcr.io/my-project/my-app \
  --platform managed \
  --region asia-northeast1 \
  --allow-unauthenticated \
  --set-env-vars DATABASE_URL=$DATABASE_URL

# Firebase CLIでホスティング
firebase init hosting
firebase deploy --only hosting

Cloudflare

CloudflareはCDN・セキュリティのリーダーで、 エッジコンピューティングやDNS、静的サイトホスティングなど開発者向けサービスを拡充しています。

# Cloudflare Pagesでデプロイ

# Wrangler CLIのインストール
npm install -g wrangler

# ログイン
wrangler login

# Next.jsアプリをCloudflare Pagesにデプロイ
# (next.config.jsでedgeランタイムを設定)
npx @cloudflare/next-on-pages
wrangler pages deploy .vercel/output/static

# Cloudflare Workers の例
// src/worker.ts
export default {
  async fetch(request: Request): Promise<Response> {
    const url = new URL(request.url);

    if (url.pathname === "/api/hello") {
      return new Response(
        JSON.stringify({ message: "Hello from the edge!" }),
        { headers: { "Content-Type": "application/json" } }
      );
    }

    return new Response("Not found", { status: 404 });
  },
};

プラットフォームの選び方

プロジェクトの要件に応じて最適なプラットフォームを選びましょう。

コスト管理

クラウドサービスは使った分だけ課金されるため、予期せぬ高額請求を防ぐための対策が重要です。

• 無料枠を活用 — 各サービスの無料枠を把握する（AWS Free Tier、Vercel Hobby等）
• 予算アラートの設定 — 月額の上限を設定し、超過前に通知を受ける
• 不要リソースの削除 — 使わなくなったインスタンスやストレージは速やかに削除
• 適切なインスタンスサイズ — 初めは小さいサイズから始めてスケールアップ
• リザーブドインスタンス — 長期利用が決まっていれば予約で割引を受ける

# 各プラットフォームの無料枠（目安）

Vercel (Hobby):
  - 帯域幅: 100GB/月
  - サーバーレス関数: 100GB-時間/月
  - ビルド: 6,000分/月

Cloudflare Pages:
  - 帯域幅: 無制限
  - ビルド: 500回/月
  - Workers: 100,000リクエスト/日（無料）

AWS Free Tier（12ヶ月）:
  - EC2: t2.micro 750時間/月
  - S3: 5GB
  - Lambda: 100万リクエスト/月
  - RDS: db.t2.micro 750時間/月

GCP Free Tier:
  - Cloud Run: 200万リクエスト/月
  - Cloud Functions: 200万呼び出し/月
  - Firestore: 1GB ストレージ