[React] React-Dom

React-Dom은 React 애플리케이션을 브라우저에서 렌더링하는 역할을 한다.
React 애플리케이션은 JSX로 작성되며, 이 코드는 Babel을 통해 자바스크립트 코드로 변환된다.
즉, JSX와 같이 자바스크립트의 표준에서 벗어난 코드는 트랜스파일이라는 과정을 거쳐서 브라우저가 이해할 수 있는 자바스크립트 코드로 변환해주는 것을 말한다.
변환된 자바스크립트 코드를 브라우저에서 실행하려면 React-Dom이 필요하다.

궁극적으로 사용자에게 배포되어지는 것은 index.html이다.
React-Dom을 사용해 render라는 함수를 실행한다.
id가 root라는 요소를 가져와서 index.html에 있는

<div id="root"></div> 

이 요소에 root 컴포넌트를 연결시켜준다.

import React from "react";
import ReactDOM from "react-dom";
import "./index.css";
import App from "./app";

ReactDOM.render(
  <React.StrictMode>
    <App />
  </React.StrictMode>,
  document.getElementById("root")
);

index.js 파일에서 연결을 해주고,
컴포넌트를 만들어나갈 때는 App.jsx에서부터 시작하면 된다!