#1.반응 및 ReactDOM

반응 및 ReactDOM:

React는 자바스크립트 라이브러리입니다. React를 사용하면 기능이 있는 재사용 가능한 UI 구성 요소를 만들 수 있습니다. 반응은 확장 가능합니다. 우리는 dom을 업데이트하는 동시에 상태 수를 늘리는 것과 같이 상태를 변경합니다. 수동으로 dom에 액세스하고 dom을 업데이트할 필요가 없습니다.

이 React 라이브러리는 HTML을 생성합니다.

import React from "react" //create element
const divElement = React.createElement("div", null, "hellow world")

이 ReactDOM은 브라우저의 #root div에서 HTML을 렌더링합니다.

import ReactDOM from "react-dom"
ReactDOM.render(divElemnt, document.getElementById("#root"));

Babel: Babel과 같은 웹 팩은 javascript가 jsx를 이해할 수 없기 때문에 jsx를 React.createElement로 컴파일합니다.

// jsx
<div className="newDiv">
  <p className="para">This is paragraph</p>
  <p className="para">Let's checkout</p>
</div>
// jsx to react
React.createElement("div", {
  className: "newDiv"
}, React.createElement("p", {
  className: "para"
}, "This is paragraph"), React.createElement("p", {
  className: "para"
}, "Let's checkout"));