ホームページ >ウェブフロントエンド >jsチュートリアル >Next.js はオープンソースであり、React に基づいたシンプルでユニバーサルな JS フレームワークを提供します。
新しいユニバーサル JavaScript フレームワーク Next.js がオープンソースになり、React ベースおよびサーバーベースの Web アプリケーションの新しい代替手段を提供します。
Zeit のチームは、React の基盤とコンポーネント モデルに基づいて Next.js を構築し、重要な拡張機能も提供しました。フレームワークは、 getInitialProps() と呼ばれるコンポーネント ライフサイクル フック メソッドを使用して、サーバー上で初期レンダリングを実行できます。必要に応じて、クライアント側でレンダリングを続行できます。ただし、この高度な機能は、小さいながらも強力なフレームワークに加えて提供されます。
Next.js の最小限の機能セットに基づいて、新しい Web アプリケーションを作成するための便利な方法を提供します。このプロセスでは多くのツール セットの構成は必要ありません。 create-react-app と同様に、このフレームワークをインストールすると、React、Webpack、Babel に基づいたビルド プロセスがセットアップされます。以前は、React コンポーネントを作成する開発者は、React 構文に基づいてページを作成していました。各ページには、次のようなレンダリング関数が用意されていました。
import React from 'react'export default () => Hello world!は API として機能するため、pages フォルダーに配置されたすべてのコンポーネントはサーバーベースのルートに自動的にマッピングされます。たとえば、ディスク上のpages/about.jsコンポーネントは、/about URLを自動的に提供します。
Express 上に構築されたビュー エンジンである Express-react-views のようなプロジェクトとは異なり、next.js は JavaScript 関数の結果のみをレンダリングする最上位のサービス レイヤーです。これを実現するために、プロジェクトは個別の CSS ファイルに依存するのではなく、Glamor を使用して CSS を処理します。
この Next.js への本質的な傾向には、いくつかの微妙な利点があります。その 1 つは、開発者が Webpack や Babel の構成をセットアップするのに時間を費やす必要がないことです。以前は、これら 2 つの手順に開発者が多くの時間を費やしていました。サイトの開発バージョンを実行するには、npm run dev を実行するだけです。
一部の開発チームにとって、ユニバーサル JavaScript は依然としてより高度なテクノロジーであり、多くのフレームワークには独自の実装があります。 Angular 2 には Universal Angular 2 があり、Ember には Fastboot があります。 React の分野には、Walmart の Electrode や Redfin の React Server など、多くのオプションがあります。 Next.js は、多くの可能性を秘めたシンプルな代替手段です。このプロジェクトは GitHub 上のオープンソースです。