React-01コースの紹介

Reactの概要
ReactはFacebookの内部プロジェクトに起源し、同社はInstagramのウェブサイトを架設するためにHTML 5技術を積極的に導入しようと試みたが、開発中にHTML 5の性能低下が著しく、予想された効果に達していないことが分かった.彼らは自分でReactフレームワークを開発した.
ReactJS公式住所:https://facebook.github.io/react/(Englist) https://zh-hans.reactjs.org/(中国語)
GitHubアドレス:https://github.com/facebook/react
二つの概念をはっきりさせる

library(ライブラリ):小さくて巧みなライブラリで、特定のAPIのみが提供されており、1つのライブラリから別のライブラリに簡単に切り替えることができますが、コードはほとんど変わりません.

Framwwork(フレーム):大きくて完全なフレームで、鉱山は一連の解決策を提供しているので、プロジェクトの真ん中で別のフレームに切り替えたい場合は、

が難しいです.
Reactの特徴

仮想DOM:Reactもデータ駆動であり、データが変化するたびにReactは仮想DOM全体をスキャンし、前回の仮想DOMとの差異変化を自動的に計算し、変化が必要な部分に対して実際のブラウザDOM更新を行う.

コンポーネント化:Reactは機能の角度から横方向に分けることができて、UIを異なるコンポーネントに分解して、各コンポーネントはすべて独立してカプセル化して、全体のUIは1つの小さいコンポーネントから構成する1つの大きいコンポーネントで、各コンポーネントは自分の論理だけに関心を持って、互いに独立して

一方向データストリーム:React設計者は、データの双方向バインドは便利であるが、複雑なシーンでも副作用が顕著であるため、Reactは一方向のデータストリーム-親ノードから子ノードに伝達する傾向があると考えている.(ReactLinkを使用しても双方向バインドは可能ですが、推奨されません)

Reactの効率化要因

仮想DOM、DOM

を常に直接操作しない

DOM Diffアルゴリズム(どこが変化しているかを計算して、それらの場所は変化していないで、変化のある場所だけを更新します)、ページの再描画

を最小化します.
フロントエンドの3つの主流フレームワーク
三大フレーム一大写し

Angular.js: フロントエンドフレームワーク、(インドでは比較的多い)2009年(Google)、学習曲線が急で、NG 1の学習が面倒で、NG 2-NG 5が始まり、一連の改革が行われ、コンポーネント化開発の概念も提供され、NG 2からTS(TypeScript)を使った編集もサポートされた.

Vue.js: (注目する人が多く、中国が多い)フロントエンドのフレームワークです.それは中国人が開発したもので、私たちにとってドキュメントは友好的です.

React.js (使う人が多く、欧米が多い)のフレームワークは、そのデザインが優れているからです.

ReactとVueの対比

モジュール化とは何か: の角度から分析を行い、いくつかの多重化可能なコードを単一のモジュールに抽出し、プロジェクトのメンテナンスと開発に便利である

コンポーネント化とは:UI の観点から分析を行い、多重化可能なUI要素を個別のコンポーネントに抽出する.プロジェクトのメンテナンスと開発を容易にする

コンポーネントのメリット:プロジェクトの規模が大きくなるにつれて、手に持っているコンポーネントが多くなり、既存のコンポーネントを簡単に完全なページにつなぐことができます.

Vueはどのようにコンポーネント化を実現するか:通過する.vueファイル、Vue.component()、Vue.extends()はコンポーネント化を実現する.

 - template      
 - script        
 - style         

Reactはどのようにコンポーネント化を実現しているのか:Reactにはコンポーネント化の概念があるが、vueのようなコンポーネント化テンプレートファイルはなく、Reactでは、すべてjsが表現している.だからReactを勉強するには、jsが合格し、ES 6とES 7(asyncとawait)が使えます.

開発チーム

vueはここ2年で火事になったので、そのコミュニティは互いにreactにとって、小さくて、いくつかの穴があって、誰も

を踏んだことがありません.

reactは誕生が早いため、コミュニティが強く、よくある問題、ピット、最適な解決策、ドキュメント、ブログはコミュニティで簡単に見つけることができます.

ReactルームメイトFacrBookフロントエンドの公式チームがメンテナンスと更新を行った.そのため、Reactのメンテナンス開発チームは、技術力が比較的強い

vue第1版は、主に著者の尤雨渓が専門的にメンテナンスを行い、vueが2.xバージョン後、尤雨渓を主導するオープンソースの小さなチームもあり、

の開発とメンテナンスを行っています.
コミュニティ
モバイルアプリの開発体験について

Vueは、Weexのような技術と組み合わせて、モバイル端末App開発への移行体験を提供しています(Weex、現在は小さなおもちゃで、成功した例はありません)

Reactは、ReactNativeと組み合わせて、モバイルAppへのシームレスな移行の開発体験(RN用が最も多く、最も人気がある)

も提供しています.
どうしてReactを勉強するの?

とAngular 1は先に比べて、Reactの設計はとても優秀で、すべてjsに基づいてそしてコンポーネント化の開発の思想を実現しました

開発チームは実力が強く、更迭を心配する必要はありません

コミュニティは強く、多くの問題が対応する解決策を見つけることができます.

はReactNativeにシームレスに移行する開発体験を提供し、私たちの技術能力を拡張し、私たちのコア競争力を強化しました.

多くの企業では、フロントエンドプロジェクトの技術選択型はReactを採用している.js

Reactのいくつかのコアの概念
仮想DOM(Virtual Document Object Model)

DOMの本質は何ですか.ブラウザの概念は、jsオブジェクトで表され、ページ上の要素であり、DOMオブジェクトを操作するAPI

を提供しています.

Reactの仮想DOMとは何か:フレームワークの概念は、プログラマがjsオブジェクトでページのDOMとDOMネスト

をシミュレートすることである.

仮想DOMを実装する理由:ページ内のDOM要素の効率的な更新

を実装するために

DOMと仮想DOMの違い

DOM