[React] JSX란?

YAYEUN·2020년 4월 6일
0

JSX란?

자바스크립트의 확장 문법으로 XML과 비슷하게 생겼다.
브라우저에서 실행되기 전에 코드가 번들링되는 과정에서 바벨을 사용하여 일반 자바스크립트 형태의 코드로 변환된다.

  • JSX 는 리액트로 프로젝트를 개발할 때 사용되므로 공식적인 자바스크립트 문법은 아니다.
//변환 전
function App(){
	return (
    	<div>hello <b>react</b></div>
    )
}

///변환 후
function App(){
 	return React.createElement("div", null, "hello", React.createElement("b", null, "react")) ;
}

JSX 장점

1. 보기 쉽고, 익숙
HTML 코드를 작성하는 것과 비슷해 가독성이 높고 작성하기도 쉽다.

2. 더욱 높은 활용도
JSX에서는 HTML태그를 사용할 수 있을 뿐 아니라, 컴포넌트도 JSX 안에서 작성 할 수 있다.

profile
yayeun

0개의 댓글