1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?

More than 1 year has passed since last update.

Next.js公式ドキュメントより

Posted at

学んだことをただアウトプットしていきます

フロントエンドエンジニアになりたいです。
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を学び始めたので、学習を進めるのに非常に時間がかかっていますが、
やはり新しいことを学ぶときはその技術ができた背景を意識しながらインプットしていくことが重要だと感じました。
その技術は何を解決するために作られたのか、どう解決しているのかを意識しながら学習していきます!

1
0
0

Register as a new user and use Qiita more conveniently

  1. You get articles that match your needs
  2. You can efficiently read back useful information
  3. You can use dark theme
What you can do with signing up
1
0

Delete article

Deleted articles cannot be recovered.

Draft of this article would be also deleted.

Are you sure you want to delete this article?