ReactDom.render

Hyun·2021년 9월 3일
0

리액트 기초

목록 보기
3/18
import React from 'react';
import ReactDOM from 'react-dom';
import './index.css';
import App from './App';
import * as serviceWorker from './serviceWorker';

ReactDOM.render(<App />, document.getElementById('root'));
//리액트 application은 하나의 컴포넌트만을 렌더링해야한다. 
//위 상황에서는 App 컴포넌트가 해당된다. 
//따라서 모든 것은 App 컴포넌트안에 들어가야 한다.

여기서 ReactDOM.render 의 역할은 브라우저에 있는 실제 DOM 내부에 리액트 컴포넌트를 렌더링하겠다는 것을 의미한다. idroot인 DOM 을 선택하고 있는데, 이 DOM 은 public/index.html 안에서 찾아볼 수 있다. => <div id="root"></div>
결국, 리액트 컴포넌트가 렌더링 될 때에는, 렌더링된 결과물이 위 div 내부에 렌더링되는 것이다.

참고: react.vlpt.us

profile
better than yesterday

0개의 댓글