やっと覚えたわ
もともと学びたいと思って、しかしまたあなたにどんな苦難をもたらすことができて、ほほほ、本当に心配させます.
これを使ってたくさんのものを作ったと聞いて、私もよく勉強して、ほほほ、役に立つことを望んでいます.
🙏🏻🙏🏻

React

What is React?

Webページを作成する場合は、HTML+CSS+JavaScript、react、Vueを使用できます.jsのようなライブラリを使用する方法があります.今のページにはたくさんのインタラクションがあります!大量のインタラクションを発生させるには、大量のステータス管理が必要です.
----->便宜上のフレームワーク-->今日から学ぶ行動
REEXはcomponent(하나의 의미를 가진 독립적인 단위 모듈)をベースに作られています!
コンポーネントにより、HTML、CSSは<Component />のように使用できます.Web上で使用される各要素をコンポーネントにして、他のプロジェクトや他の場所で再利用できるという大きな利点があります.

ES6

REEXは基本的にES 6をベースに作られているそうです!
基本的に7つの概念を知る必要があります.

Destructuring

spread operator

rest parameters

default parameters

template literals

arrow function

for-of loop

JSX

const element = <h1>Hello, world!</h1>;

上のラベルの文法は?何ですか.
文字列でもHTMLでもない...
JSXはJavaScriptの拡張構文です
JSXとは何ですか.
Reactは、レンダリングロジックが他のUIロジックと本質的に関連しているという事実を受け入れている.例えば、イベントの処理方式、状態の時間的変化、および画面上のデータの表示方式などである.
Reactは、注釈と論理を個別のファイルに置くのではなく、ばらばらに接続されたユニットから注目点を分離します.JSに寸法を追加するのに慣れていない場合は、後のセクションでコンポーネントを返します.
JSXを使用する必要はありませんが、JavaScriptコードでUI関連操作を実行する場合、JSXを使用すると視覚的に役立つと考えている人が多いようです.また、エラーと警告メッセージを表示して、行動を支援することもできます.React公式文書
これが何を意味するのか今まで分からなかった.
DOMとJavaScriptを使用して新しいコンセプトを作成することに慣れています😩
JSXルール

は、縁取りで包まなければなりません.

<div> 
  <div>
  	<h1>hello</h1>
  </div>
<div>
  	<h2>wailli</h2>
  </div>
</div>

2.JavaScriptコードを適用する場合は、{}に記述します.

class App extends Component{
  render(){
     const name = 'walli';
     return (
       <div>
       hello{name}!
       </div>
  );
 }
}

JSX内部ではif文は使用できません.△三つの連語を使わなければならない.

<div>
  {
	(1+1 ===2)?(<h1>정답</h1>) : (<h1>탈락</h1>)
  }
</div>

Ellimentのクラス名を適用する場合は、classNameを使用します.

<div className='app-container'> hello </div>

Component & Props

関数構成部品

Javascript関数を作成して作成できます.

function Welcome(props) {
  return <h1>Hello, {props.name}</h1>;
}

Props

Propsは、属性を表すデータである.オブジェクトパラメータを受信したらreact elmentに戻ります.

クラス構成部品

ES6 classを使用して構成部品を作成できます.

class Welcome extends React.Component {
  render() {
    return <h1>Hello, {this.props.name}</h1>;
  }
}

State

State : 컴포넌트의 사용 중 컴포넌트 내부에서 변할 수 있는 값

Props vs State
-Propsは外部から渡された値です
-ステータスは内部変化の値です

Propsの正しい例
-名前、性別

Stateの正しい例
-年齢、今住んでいるところ、就職するかどうか、結婚するかどうか

の最後の部分

具体的にどのように使われているのかはまだ分かりませんが...
簡単なSprint Twitterも作られていますが、DOMやJavascriptを使って作るよりも難しいようです.😫
概念を整理してから理解を学ばなければならない.
やはり新しいことを学ぶと頭が混乱する