はじめに

Next.js15.1が出たので、気になった内容をまとめてみました。
間違いなどありましたら、コメントなどで教えてください。

https://nextjs.org/blog/next-15-1

各種コマンド

Next.jsの最新バージョンにアップグレードする際に、必要なコードの修正や設定変更を自動的に行います。手動で変更する手間を省く。

Next.jsプロジェクトで使われているnext、react、react-domを手動で最新バージョンに更新します。この場合、コードの修正は自分で行う必要があります。

最新のバージョンで新規プロジェクトを作成

主な更新内容

• React 19を完全サポート
• エラーデバッグの改善
• after(安定)
• forbidden(403)/unauthorized(401) エラーページの追加 (Canary)

それぞれの詳細

主な変更内容についての詳細を書いていきます。

React 19を完全サポート

React 19が、Pages RouterとApp Routerの両方で正式にサポートされました。
React 19についての詳しい情報は、以下が参考になります。

https://react.dev/blog/2024/12/05/react-19

https://zenn.dev/uhyo/books/react-19-new

エラーデバッグの改善

Next.jsのエラーデバッグが改善され、ターミナル、ブラウザー、または接続されたデバッガーのいずれに問題が表示されても、問題の原因をすばやく特定できるようになりました。
これらの機能強化は、WebpackとTurbopack (現在は Next.js 15で安定) の両方に適用されます。
以下に、主な変更点が記載されています。
もっと詳しい内容については、追記したいと思います。

https://nextjs.org/blog/next-15-1#react-19-stable

after APIの安定版がリリース

レスポンスがストリーミングを終了した後に処理するタスクをスケジューリングできるようにし、プライマリ・レスポンスをブロックすることなくセカンダリ・タスクを実行できるようにするAPIです。
そのafter APIが安定版としてリリースされました。
after APIの詳しい情報は、以下をご覧ください。

https://nextjs.org/docs/app/api-reference/functions/after

forbidden(403)/unauthorized(401) エラーページの追加 (Canary)

実験的にですが、403, 401の場合に専用のエラーページを表示する機能が追加されました。
実装方法は、以下のようになります。

専用のエラーページは、今まで同様に「app」フォルダ配下にファイルを作成します。

最後に

他にも色々な記事を書いているので、よければ読んでいってください！

https://qiita.com/hukuryo/items/97797a91d7e2ee0bcabc

https://qiita.com/hukuryo/items/2c07c52ff3386d5d75b9

https://qiita.com/hukuryo/items/ebeb26823f944f143b11
[cv:issue_marketplace_engineer]