참고 : Build your own React

Step 0: 왜 React를 직접 만들어볼까?

• React를 설치하지 않고 직접 JavaScript로 구현해서 사용하는 것에 기능적인 이점은 없다.
• React를 사용하면서도 내부적으로 어떤 구조로 동작하는지는 모르는 경우가 있다.
• JS로 React의 기능을 구현해보면서 React의 구조를 제대로 알고 사용할 수 있다.

Step I: The createElement Function

우리가 평소 React를 사용할 때,

제목 요소를 만들고 싶으면 보통 아래와 같이 JSX 코드를 작성합니다:

const element = <h1 title="foo">Hello</h1>

하지만 JSX는 브라우저에서 직접 실행할 수 없는 문법이라서

Babel 같은 컴파일러가 이 JSX 코드를 React가 이해할 수 있는 JavaScript 코드로 변환해 줍니다.

const element = React.createElement("h1", { title: "foo" }, "Hello");

이렇게 React.createElement라는 함수를 호출하는데,

React.createElement는 type, props, children을 가진 React Element 객체를 생성합니다.