Next.js
https://upload.wikimedia.org/wikipedia/commons/thumb/8/8e/Nextjs-logo.svg/800px-Nextjs-logo.svg.png
ReactのFront-end Framework
Next.js - The React Framework
ハッピーな点
ページごと、componentごとに色々なレンダリング Renderingの調整ができる
面倒な初期設定は、自動で行ってくれる
パターン化されているので、概念を一度理解しておくとApp理解しやすい
Routes ルート
pagesディレクトリの下にJSファイルを作成するだけ
ファイルへのパスがURLパスへ
移動
next/link
metadata メタデータ web
next/headでcomponent化されてる
サポートブラウザ
IE11とすべての最新ブラウザー(Edge、Firefox、Chrome、Safari、Operaなど)
ポリフィル Polyfillあり
https://qiita.com/jagaapple/items/faf125e28f8c2860269c#最後に
Next.js を使った JAMstack なブログの始め方 | gotohayato.com
大事
Docを見れば、なんとなく利用方法はわかるし、機能は都度更新されていく
各概念を抑えておくと良い
各APIを何に使うのが良いか把握しておくと良い
参考
レシピサービスのフロントエンドを Next.js と GraphQL のシステムに置き換えている話 - クックパッド開発者ブログ
Next.js新卒研修資料byリクルート
さくっとまとまって、ポイント抑えてくれていて、最初に見るのに良い(毎年更新されそうな点もGood)
VercelとIncremental Static Regeneration ISRの話も言及してくれている
https://twitter.com/lydiahallie/status/1591120215189749760
12と13の比較図