Next.js 15 プロジェクトを Next.js 16 にアップグレードする方法

Next.js 16 はすでにリリースからしばらく経ちますが、私自身の複数のプロダクトや個人プロジェクトをすべてアップグレードしてみたところ、大きな問題は一切発生しませんでした。現時点では、安心してアップグレードをおすすめできる状態だと感じています。

最大のメリットは、開発体験の大幅な高速化です。公式が公開している数値では、Fast Refresh が 5〜10 倍、ビルド速度が 2〜5 倍向上しています。

アップグレード手順

Next.js チームが提供している next-devtools-mcp を利用すると、アップグレード作業の大半を Agent に任せることができます。以下は具体的な流れです。

使用している開発ツールに合わせて MCP を設定します。

Cursor： Cursor Settings → MCP → New MCP Server に進み、以下を追加します：

{
  "mcpServers": {
    "next-devtools": {
      "command": "npx",
      "args": ["-y", "next-devtools-mcp@latest"]
    }
  }
}

Claude Code： claude mcp add next-devtools npx next-devtools-mcp@latest
Codex： codex mcp add next-devtools -- npx next-devtools-mcp@latest
Gemini CLI： gemini mcp add -s user next-devtools npx next-devtools-mcp@latest

ほかのツールを使っている場合は、next-devtools-mcp のページで設定方法を確認できます。

エディタの Agent モードを開き、以下のように入力します：

Next Devtools, help me upgrade my Next.js app to version 16

これだけで、主要なアップグレード作業を自動で進めてくれます。

Agent は通常 Next.js や ESLint を更新しますが、React のバージョンは自動で更新されないため、手動で以下を実行してください：

pnpm i react@latest react-dom@latest @types/react@latest @types/react-dom@latest

.pnpm-store

最後に .next ディレクトリを削除し、開発サーバーを再起動します：

npm run dev

これで Next.js 16 で開発を始められます。

私の各プロジェクトでは、Next.js 16 へ移行してから 1 か月以上安定して動作しており、唯一の変化は「開発がとにかく快適になった」という点でした。そのため、NEXTY.DEV も Next.js 16 にアップグレード済みです。