내용 정리
- JSX를 간단히 정의하면 JavaScript를 확장한 문법입니다. 사실 보통은 JSX가 적용되어 있는 게 당연하다고 여기는데, 보통은 이미 누군가에 의해 셋업이 되어 있는 프로젝트에 참여하거나 CRA를 통해서 React 프로젝트 셋업을 하기 때문에 그렇다고 볼 수 있습니다. 원래 React에서 하나의 element를 만들고 싶으면 자바스크립트처럼 React 내에 createElement라는 내장함수를 사용하고 인자를 넘겨줘서 생성해야 하지만 코드의 복잡도가 증가하고 가독성이 다소 떨어지게 됩니다. 그런 맥락에서 사용하게 된 것이 JSX 문법입니다. JSX를 사용하기 위해서는 babel을 적용해야 하고 트렌스파일(transplie)을 거쳐서 순수 자바스크립트로 변환됩니다.
꼬리 질문
- JSX는 React에서만 사용하는 문법인가요?
- React로 대표되긴 하지만 다른 프레임워크나 라이브러리에서도 사용합니다. Vue 같은 경우에도 Vue에서 제공하는 템플릿 대신 별도의 설정을 통해 JSX를 사용할 수 있습니다.
- JS에서는 JSX 사용 가능한가요?
- JSX의 단점은 뭐가 있을까요?
참고자료
평소엔 책과 영화와 음악을 좋아합니다. 보편적이고 보통사람들을 위한 서비스 개발을 꿈꾸고 있습니다.