Learn Next.jsでNext.js 14に入門
Learn Next.jsとは
Learn Next.jsとはNext.js 14のローンチに際して追加された公式チュートリアル的なページで、AppRouterなどNext.jsの様々な機能を学べます。
請求書を管理するダッシュボードを認証機能やDB連携をしつつ実装していくことで進んでいき、Next.jsの諸知識・思想を学べるものになっています（一部実験的な機能が含まれています）。
PaaS（Vercel）を活用して、作成したwebサイトを公開することも内容に含まれています。エラーハンドリングやZodによるバリデーションと型付けなど実践的な内容も含まれており、Webアプリ開発において重要な点を学ぶことができると思います。
発表されてからすぐに取り組んだため、内容が変更になる場合があります。（実際、取り組んでいる最中に内容が変わっていたりもしました。）
必要事項
- HTMLについては少しかじったくらいの知識はほしいかも。
- CSSについては、TailwindCSSの解説を入れてくれているので、なくてもほとんど問題なさそう。
- JavaScript（TypeScript）とReactに関する知識は持っておきたい。React用のコースも新たに追加されているので、必要な場合には先にやっておくのが吉か。
introductionにも書いてありますが、Node.jsのインストールやgithubアカウント、Vercelアカウントの作成も必要ですね。
注意しておきたい点
出たばかりなので、バグや記述の不整合が含まれている場合がある。修正をするには若干知識が必要かも。
各チャプター上部にも記載されていることだが、内容は変更される場合あり。
This is an early iteration. Content and code may change.
また、必ずしもチャプターごとに内容が独立しているわけではなく、チャプターによっては終了時点でビルドに失敗する場合もあったのでVercelで公開したい場合などは注意。
（ついでにこちらも出たばかりであることが理由だが、対話型AIに聞いても回答できないケースが多いと思います。）
注目している点
実施任意のチャプターとして、Next.js 14で実験的に追加されたレンダリング手法である、PPR（Partial Prerendering）の解説が用意されている。
次世代の標準レンダリング手法となるのか注目ですね。
執筆時点では、実際に使用するのにnpm install next@canaryを実行してNext.jsのカナリアリリース版をインストールする必要があった。（canaryとは鳥のカナリアのことで、炭鉱のガス漏れ検知用にカナリアを連れていく実験が名前の由来だそう。）
Discussion