jsx(JavaScript XML) 는 뭐고, 왜 필요한건지?

• 자바스크립트를 확장한 문법
• JavaScript 파일을 HTML 과 비슷하게 마크업을 작성할 수 있도록 해준다.

JSX 는 XSS 를 방지한다.

• 기본적으로 ReactDOM 은 JSX 에 삽입된 모든 값을 렌더링하기 전에 이스케이프하므로, 애플리케이션에서 명시적으로 작성되지 않은 내용은 주입되지 않는다.
• 모든 항목은 렌더링되기 전에 문자열로 변환된다.
• 이런특성으로 인해 XSS 공격을 방지할 수 있다.

JSX 는 객체를 표현한다.

• babel 은 JSX 를 React.createElement()호출로 컴파일한다.

const element = React.createElement(
  'h1',
  {className: 'greeting'},
  'Hello, world!'
);

왜 JSX 는 객체로 표현될까?

• 리액트는 반환된 객체를 사용하여 버츄얼돔을 구성한다.