学んだことをただアウトプットしていきます
フロントエンドエンジニアになりたいです。
Next.js学習開始からもうすぐ3週間が経とうとしています。
事前レンダリングとデータ取得
プリレンダリング
事前レンダリング、プレレンダリングともいう。
Next.jsではすべてのページをプリレンダリングします。
そもそもレンダリングとは??
このプリレンダリングでパフォーマンスとSEOが向上することが、Next.js一番の強みだと思います。
プリレンダリングの2つの形式
プリレンダリングは「SSG」と「SSR」があります。
- SSG(Static Site Generation):HTML は ビルド時 に生成され、リクエストごとに再利用されます。
- SSR(Server-side Rendering):HTML は リクエストごと に生成されます。
パフォーマンス上の理由から、「SSG」が推奨されています。
各ページで使用するプリレンダリング形式を選択できます。また、両方の形式を使って「ハイブリッド」Next.jsアプリを作成できます。
まとめ
以上、公式から拾ってきただけのアウトプットです。
使い方とかは全然わからないですが、とりあえず概要は理解できたと思います。
私はReactの基礎知識も固まってないままNext.jsを学び始めたので、学習を進めるのに非常に時間がかかっていますが、
やはり新しいことを学ぶときはその技術ができた背景を意識しながらインプットしていくことが重要だと感じました。
その技術は何を解決するために作られたのか、どう解決しているのかを意識しながら学習していきます!