
725
17.7 JSX: 자바스크립트의 마크업 표현식
들을 만들 때마다 자바스크립트 모듈에서 바벨을 실행하는
babel-loader
모듈을
지원합니다.
최근에는 자바스크립트 언어를 변환해야 하는 경우가 별로 없지만, 표준이 아닌
자바스크립트 확장을 지원할 의도로 바벨을 쓰는 경우는 여전히 많습니다. 이어지
는 절에서 확장 두 가지를 소개합니다.
17.7
JSX는 HTML 스타일의 문법을 써서 요소 트리를 정의하는 코어 자바스크립트의 확
장입니다. JSX는 웹 사용자 인터페이스에 사용하는 리액트 프레임워크와 밀접하
게 연관돼 있습니다. 리액트에서 JSX로 정의된 요소 트리는 결국 웹 브라우저에서
HTML로 렌더링됩니다. 여러분이 직접 리액트를 사용할 일이 없더라도, 리액트는
워낙 많이 사용되므로 JSX가 쓰인 코드를 자주 보게 될 겁니다. 이 절에서는 JSX를
이해하는 데 필요한 내용을 설명합니다. 이 절은 언어 확장인 JSX에 관한 절이지 리
액트에 관한 절이 아니며, 리액트는 JSX 문법을 이해하는 데 꼭 필요한 만큼만 설명
합니다.
JSX 요소는 새로운 타입의 자바스크립트 표현식 문법이라고 생각해도 됩니다.
자바스크립트 문자열 리터럴은 따옴표로 구분하고 정규 표현식 리터럴은 슬래시로
구분합니다. ...