反応足場とは何ですか?

React スキャフォールディングには、1. React App の作成、2. Next.js、3. Gatsby、4. nwb、5. razzle、6. Neutrino、7. React-cli、8. Rekit などが含まれます。

このチュートリアルの動作環境: Windows7 システム、react17.0.1 バージョン、Dell G3 コンピューター。

1. スキャフォールディングについて理解する

1.1. フロントエンド エンジニアリングの複雑さ

いくつかの小さなデモ プログラムを開発するだけで、次のような複雑な問題を考慮する必要はありません:

• たとえば、ディレクトリ構造をどのように整理して分割するかなど、

• 例: ファイル間の相互依存関係を管理する方法;

• 例: サードパーティ モジュールの依存関係を管理する方法;

• たとえば、リリース前にプロジェクトを圧縮してパッケージ化する方法 プロジェクト;

• お待ちください...

最新のフロントエンド プロジェクトますます複雑になっています:

• HTML にいくつかの CSS ファイル、記述されたいくつかの JS ファイル、またはサードパーティの JS ファイルを導入するほど単純ではなくなりました。

• たとえば、css が使用される可能性がありますless や sass などのプリプロセッサを作成する場合、ブラウザで解析できるようにする前に通常の CSS に変換する必要があります。 #たとえば、JavaScript コードは、もはや少数のファイルに記述されているだけではありません。代わりに、モジュール化により数百、数千のファイルで構成されています。モジュール化テクノロジを使用して、ファイル間の相互依存性を管理する必要があります。

• たとえば、プロジェクトが多くのサードパーティ ライブラリに依存する必要がある場合、それらをより適切に管理する方法 (依存関係の管理、バージョン アップグレードなど);

• 上記の問題を解決するには、さらにいくつかのツールを学ぶ必要があります:

babel、webpack、gulp など。変換ルール、パッケージ化の依存関係、ホット アップデートなどを構成します。

• #プロジェクトを開始する前に、一連のエンジニアリング上の問題に直面することがわかります。

• スキャフォールディングの出現は、この一連の問題の解決に役立ちます;

1.2. スキャフォールディングとは何ですか?

#伝統的な足場とは、建築における構造を指します。建物や建物を建てるときに建てられる仮のフレームです。

言及された足場プログラミングにおける は、実際には、プロジェクトのエンジニアリング構造を迅速に生成するのに役立つツールです。

## 各プロジェクトは完全なものを作成します。効果は異なりますが、基本的なエンジニアリング構造は似ています。

これらは似ているため、毎回最初から作成する必要はありません。いくつかのツールを使用して、基本的なエンジニアリング テンプレートを作成できます。
このテンプレートに基づいてさまざまなプロジェクトを開発したり、構成に簡単な変更を加えることができます。
これにより、プロジェクトの基本的な構造の一貫性が間接的に確保され、後のメンテナンスが容易になります。 ;
• 概要: 足場を使用すると、建設から開発、展開までのプロジェクト全体が可能になります。プロセスが迅速かつ便利になります。;

足場とは反応用

1.公式に推奨されるスキャフォールディング (https://react.docschina.org/docs /create-a-new-react-app.html)

実際、React には多くのスキャフォールドがあり、その中で公式に推奨されているスキャフォールドは次のとおりです:

React アプリの作成 : React を学習している場合、または新しいシングルページ アプリケーションを作成している場合

Next.js: Node.js を使用してサーバーサイドでレンダリングされる Web サイトを構築している場合
Gatsby: コンテンツ指向を構築している場合静的 Web サイト
nwb: React アプリケーション、ライブラリ、およびその他の Web npm モジュール用のツールキット
razzle: サーバーでレンダリングされるユニバーサル JavaScript アプリケーションを作成する構成なしで
Neutrino: 初期構成ゼロで最新の JavaScript アプリケーションを作成および構築
• 2. その他のスキャフォールディング

#react-cli 足場

Rekit 足場

• ##[関連する推奨事項:

  Redis ビデオチュートリアル＃＃＃]＃＃＃

以上が反応足場とは何ですか?の詳細内容です。詳細については、PHP 中国語 Web サイトの他の関連記事を参照してください。