スタイリングと機能
出典: フリー百科事典『ウィキペディア(Wikipedia)』 (2022/07/07 21:47 UTC 版)
「Next.js」の記事における「スタイリングと機能」の解説
Next.jsは、 CSSだけでなく、プリコンパイルされたScssとSass 、 CSS-in-JS 、およびスタイル化されたJSXを使用したスタイリングをサポートしている。更に、 TypeScriptサポートとスマートバンドルで構築されている。オープンソースのトランスパイラーBabelは、コードをブラウザーで使用できるJavaScriptに変換およびコンパイルするために使用されている。後でモジュールをバンドルするために、別のオープンソースツールであるWebpackが使用される。これらのツールはすべて、ターミナルのnpmで使用する。 Next.jsの主な機能は、サーバー側のレンダリングを使用してWebブラウザーの負担を軽減し、セキュリティを強化することである[要出典] 。これは、アプリケーションの任意の部分またはプロジェクト全体に対して実行できるため、コンテンツが豊富なページをサーバー側のレンダリング用に選択できる。また、サイトのアセットをまだダウンロードしていないWebブラウザーの負担を軽減するために、初めての訪問者に対してのみ実行できる。 「ホットリロード」機能は、変更が加えられたときにそれを検出し、適切なページを再レンダリングするため、サーバーを再起動する必要はない。これにより、アプリケーションコードに加えられた変更をすぐにウェブブラウザに反映できるが、一部のブラウザではページを更新する必要がある。このソフトウェアは、開発者の便宜のためにページベースのルーティングを使用し、動的ルーティングのサポートが含まれている。その他の機能には、モジュールをライブで交換できるホットモジュールの交換、ページの読み込みに必要なコードのみを含む自動コード分割、読み込み時間を短縮するためのページのプリフェッチなどがある。 Next.jsは、インクリメンタル静的再生(ISR) および静的サイト生成(SSG)もサポートする - Webサイトのコンパイル済みバージョンは、通常、ビルド時にビルドされ、.nextフォルダーとして保存される。ユーザーがリクエストを行うと、静的HTMLページであるビルド済みバージョンがキャッシュされて送信される。これにより、読み込み時間が非常に速くなるが、頻繁に変更され、多くのユーザー入力を利用するインタラクティブなサイトには適さないため、すべてのWebサイトに適しているわけではない。
※この「スタイリングと機能」の解説は、「Next.js」の解説の一部です。
「スタイリングと機能」を含む「Next.js」の記事については、「Next.js」の概要を参照ください。
- スタイリングと機能のページへのリンク