var a = React.createElement(
"div",
null,
React.createElement(
"h1",
null,
"Awesome ",
React.createElement(
"b",
null,
"React"
)
)
);
응?... 불편해서 못한다.
자바스크립트를 확장하였으며 XML과 비슷하게 생긴 새로운 문법, JavaScript XML
bable-loader를 사용하여 자바스크립트로 변환한다.
var a = (
<div>
<h1>Awesome <b>React</b></h1>
</div>
)
훨씬 보기 쉽고 익숙한 코드
바벨에서 JSX → JS로 변환시에 문법에 오류가 있다면 이를 감지하고 알려준다.
Virtual DOM에서 컴포넌트 변화를 감지할 때 반드시 트리구조가 되어야 한다.
React 16 이상에서는 Fragment 컴포넌트 제공
JSX 안에서 자바스크립트 표현식을 사용할 수 있다.
JSX 내부의 자바스크립트 표현식에서 if 문을 사용할 수 없다.