発行:

Vercel へのデプロイ

いよいよ、あなたの作ったアプリケーションをインターネット上に公開（デプロイ）しましょう。
Next.js の開発元である Vercel (バーセル) を使うのが最も簡単で、かつ高性能です。

前提条件

  • GitHub (または GitLab/Bitbucket) のアカウントを持っていること。
  • 作成したコードを GitHub のリポジトリにプッシュしていること。

手順

1. Vercel に登録

Vercel 公式サイト にアクセスし、「Sign Up」からアカウントを作成します。
「Continue with GitHub」を選ぶと、リポジトリの連携もスムーズなのでおすすめです。

2. 新しいプロジェクトを作成

Vercel のダッシュボードにある「Add New...」ボタンから「Project」を選択します。

3. リポジトリをインポート

連携した GitHub アカウントにあるリポジトリ一覧が表示されます。
公開したい Next.js プロジェクトのリポジトリの横にある「Import」ボタンを押します。

4. 設定を確認してデプロイ

「Configure Project」画面が表示されます。
Next.js プロジェクトであれば、基本的に 設定を変更する必要はありません 。Vercel が自動的に Next.js であることを認識し、最適な設定をしてくれます。

  • Environment Variables : もし .env ファイルで環境変数（APIキーなど）を使っている場合は、ここで入力します。

「Deploy」ボタンをクリックします。

5. 完成！

ビルド処理が始まり、1〜2分ほどで完了します。
画面に紙吹雪が舞い、生成されたURL（例: https://my-next-app-xxxxx.vercel.app）が表示されます。
そのURLにアクセスすれば、あなたのアプリが世界中から見られるようになっています！

自動デプロイ (CI/CD)

Vercel の素晴らしい点は、 GitHub と連携している ことです。

今後、あなたがローカルでコードを修正し、GitHub の main ブランチにプッシュするたびに、Vercel がそれを検知して 自動的に本番環境を更新（再デプロイ） してくれます。
面倒なFTPアップロードなどは一切不要です。

まとめ

Next.js と Vercel はニコイチの関係です。
特にこだわりがなければ、まずは Vercel で公開するのがベストプラクティスです。

  1. コードを GitHub にプッシュ。
  2. Vercel でインポート。
  3. Deploy ボタンを押す。

たったこれだけで、SSL対応（HTTPS）、CDN配信、高速なサーバーレス環境がすべて手に入ります。
ぜひあなたの作品を公開してみてください！