[reactJS]レスポンスの開始

反応とは?

Reactは,複雑なユーザインタフェースの構築を簡略化するためにフェイスブックに作成されたJavaScriptライブラリである.
Reactは、個々の構成部品単位を組み合わせてページを作成します.

JavaScriptライブラリ
重複コード作成中に再利用する必要がある機能を排除するために、任意の必要な場所で呼び出す機能または機能です.

なぜ

Reactを使うのですか?
UIの再利用性が良く、コードの可読性が高い.
メンテナンスが容易(問題のある構成部品をすばやく見つけることができます)
React Native(モバイルアプリケーション言語)の拡張性.

のようなライブラリとフレームワーク
VueJS, AngularJS

構成部品

機能を実行するUI単位.
構成部品DOMツリーなどのVipical Dom TreeというTree形式で作成されます.

Virtual DOM Tree
Reactが所有する仮想DOMツリー(本物のドームツリーをコピーした)

JSX構文

JSXはjavascript構文で、JavaScriptでHTML構文を使用してビューを整理するのに役立ち、応答プログラムの開発に役立ちます.

re-render

スクリーン上でユーザのために素子を分割する際に使用するrander関数を再呼び出すプロセス.
更新前の仮想DOM Tree状態が更新後の仮想DOM Tree状態と比較され、更新された場合、Real DOM Treeが更新される.

Reactプロジェクトの作成

npm, npx, yarn
Nodeプロジェクトにインストールされているすべてのパッケージまたはリポジトリを管理するツールです.
Reactは様々なオープンソースライブラリ(ツール)を用いて開発されている.

npm

ノードの基本パッケージ管理ツール.

の使用頻度が最も高い.

create-accreact-app実行時にライブラリをダウンロードする必要があります.非常に重いです.

npmでは反応項目はうまく作成されません.npm install 패키지명

npx

npmとは異なり、パッケージのみを実行するツールです.

反応項目を生成する際に最も多く使用される.

npxを使用してcreate-act-appをインストールすることなく実行できます.

npm 5.2以降のバージョンは、基本パッケージ管理ツールに含まれ始めます.npx create-react-app 프로젝트명

yarn

は,従来のnpmと比較して速度と安定性に優れ,注目されている.

現在、速度、安定性、およびnpmが追い越されている.

のセキュリティにおいて、npmおよびnpxとは異なる.

ですが、npmが最も多く使用されているため、糸がサポートされていないライブラリがたくさんあります.npm install -g yarn yarn add 패키지명

Reactプロジェクトの作成

// 프로젝트를 생성할 폴더에서 
// Mac은 터미널, 
// Windows는 Cmder 혹은 vscode 터미널 실행

// 프로젝트 생성
> npx create-react-app 프로젝트명

// 실행 (기본포트 3000)
> cd 프로젝트명
> npm start

Webパッケージ

最も一般的なモジュールバンドルパッケージ.
アプリケーションを構成するすべてのリソース(HTML、CSS、PNGなど)を各モジュールと見なし、それらを組み合わせて統合された成果物を作成するツールです.

モジュール
プログラミングの観点から、特定の機能を持つ小さなコードユニット.
機能コードセット.