Vercelにデプロイする
なぜ学ぶか: Next.jsを作った会社が運営するVercelは、「GitHubにpushしたら勝手にデプロイされる」体験を提供します。個人開発ならほぼ無料。AIが作ったアプリを世界に出す最短ルートで、プレビュー(本番前の確認環境)も自動でついてきます。
Vercel=Next.jsの本家ホスティング
Next.jsの開発元が運営していて、設定ほぼゼロで全機能が動きます。個人利用は無料枠で十分始められます。
GitHub連携が基本
リポジトリをVercelにつなぐと、pushのたびに自動でデプロイ。最初に学んだGitが、ここで「公開の起点」になります。
mainへpush=本番更新
本番ブランチへのpushが本番デプロイに直結します。「mainは常にデプロイできる状態に」という規律が自然に生まれます。
プレビュー=本番前のお試し環境
別ブランチをpushすると、専用URLの確認環境が自動で生えます。本番に影響なく「AIの変更を実環境で確認」できます。
失敗したらダッシュボードのログを見る
デプロイのたびにVercelの画面に記録が残ります。失敗したら赤い表示のログを開き、そのままAIに貼れば原因を特定できます。
デプロイの流れ
Vercel デプロイの流れ(初回) 1. GitHub にリポジトリを push 2. vercel.com → Add New → Project 3. GitHub リポジトリを選んで Import 4. Deploy を押す → 数分で https://your-app.vercel.app が誕生 以後の運用: - main に push → 本番が自動更新 - 別ブランチに push → プレビュー環境が自動で生える
「pushしたら公開される」— つまりGitの操作がそのまま公開の操作になります。mainにpushする前にdiffを確認する習慣が、ここで実利になります。
ステップ 1 / 2
※ カリキュラムの内容はAIが生成しており、誤りが含まれる場合があります。正確な情報は公式ドキュメント等でご確認ください。