[React] JSX (JavaScript XML)

 

JSX (JavaScript XML)

• JavaScript 안에서 HTML 같은 문법을 쓸 수 있게 해주는 확장 문법
• HTML 처럼 보이지만 실제로는 JavaScript
• 브라우저는 JSX를 직접 이해하지 못함
  - Babel 같은 Code Transformer가 JSX를 React.createElement 형태의 JavaScript 코드로 변환하는 식
• 중괄호 {} 안에 변수나 함수 호출 결과 등을 넣을 수 있음
• JSX는 내부적으로 컴파일 될 때, 첫 글자가 소문자면 HTML 태그, 대문자면 React 컴포넌트로 취급함
  - 공식가이드에서도 컴포넌트는 PascalCase(대문자로 시작하는 단어 조합)로 작성할 것을 권장

 

React는 JSX 사용이 필수가 아니다.

공식문서에서도 선택(optional)이라고 말하고 있다.

하지만 편하니까.