Next.jsとVercel

VercelはNext.jsの開発者によって作られ、Next.jsを第一級にサポートしています。Next.jsアプリをVercelにデプロイすると、デフォルトで以下が行われます。Vercel、以下のことがデフォルトで発生します。

• 静的生成とアセット（JS、CSS、画像、フォントなど）を使用するページは、非常に高速なVercel Edge Networkから自動的に配信されます。
• サーバーサイドレンダリングとAPIルートを使用するページは、自動的に分離されたサーバーレス関数になります。これにより、ページのレンダリングとAPIリクエストを無限にスケーリングできます。

Vercelには、他にも多くの機能があります。

• カスタムドメイン：Vercelにデプロイしたら、Next.jsアプリにカスタムドメインを割り当てることができます。Vercel、次のドキュメントを参照してください。ドキュメントはこちらです。
• 環境変数：Vercelで環境変数を設定することもできます。Vercelはこちらです。ドキュメントはこちらを参照してください。その後、これらの環境変数を使用することができます。
• 自動HTTPS：HTTPSは（カスタムドメインを含む）デフォルトで有効になっており、追加の設定は必要ありません。SSL証明書は自動的に更新されます。

プラットフォームの詳細については、Vercelドキュメント.

を参照してください。

プッシュごとにプレビューデプロイ

以下の手順は**任意**です。試してみることも、単に読んでみることもできます。VercelVercelにデプロイした後、可能であれば以下の手順を試してください。

• アプリに新しい**ブランチ**を作成します。
• 変更を加えてGitHubにプッシュします。
• 新しい**プルリクエスト**を作成します（GitHubヘルプページ）。

プルリクエストページにvercelボットによるコメントが表示されます。

このコメント内の**プレビュー**URLをクリックしてみてください。加えた変更が表示されます。

プルリクエストが開いている場合、Vercelは、プッシュごとにそのブランチの**プレビューデプロイ**を自動的に作成します。プレビューURLは常に最新のプレビューデプロイを指します。

このプレビューURLを共同作業者と共有して、すぐにフィードバックを得ることができます。

プレビューデプロイが良好な場合、mainに**マージ**します。これを行うと、Vercelは、本番デプロイを自動的に作成します。

開発、プレビュー、リリース

私たちは、**DPS**と呼ぶワークフローを説明しました。**D**evelop（開発）、**P**review（プレビュー）、**S**hip（リリース）です。

• 開発：Next.jsでコードを記述し、ホットリローディング機能を利用するために実行中のNext.js開発サーバーを使用しました。
• プレビュー：GitHubのブランチに変更をプッシュし、VercelURLからアクセスできるプレビューデプロイを作成しました。このプレビューURLを他の人と共有してフィードバックを得ることができます。コードレビューに加えて、デプロイプレビューを行うことができます。
• リリース：プルリクエストをmainにマージして本番環境にリリースしました。

Next.jsアプリを開発する際には、このワークフローの使用を強くお勧めします。これにより、アプリの反復作業をより迅速に行うことができます。