핵심 라이브러리

React의 핵심 모듈 2개로 React가 하는 일을 알아보자

1. ReactDom : React Component를 HTML Element에 연결함

import ReactDom from 'react-dom';

2. React Component 만들기

import React from 'react';

1) ReactDom

만들어진 React component를 실제 HTML Element에 연결할 때 ReactDOM 라이브러리를 이용합니다.

https://reactjs.org/docs/react-dom.html
https://ko.reactjs.org/docs/react-dom.html

ReactDom.render(
	<HelloMessage name="Taylor" />,
    document.getElementById("hello-example")
);

class HelloMessage extends React.Component {
	render() {
    	return (
        	<div>Hello {this.props.name}</div>
        );
    }
}

• 다음 HelloMessage는 하나의 component.
• 이를 document.getElementById("hello-example")(Dom)와 연결해주는 역할을 하는 함수가 ReactDom.render()
• ReactDom.render()는 main()처럼 시작함수.

2) React component 만들기 - API 모음

https://reactjs.org/docs/react-api.html
https://ko.reactjs.org/docs/react-api.html

3) CDN을 통한 React 라이브러리 사용

https://reactjs.org/docs/cdn-links.html
https://ko.reactjs.org/docs/cdn-links.html