JSX
- JSX 는 JavaScript 파일 내에 HTML과 유사한 마크업을 작성할 수 있게 해주는 JavaScript용 구문 확장이다.
- JSX와 React는 서로 다르다.
- 함께 사용되는 경우가 많지만, 서로 독립적으로 사용할 수도 있다.
- JSX는 구문 확장이고 React는 JavaScript 라이브러리입니다.
JSX 특징
- React는 JSX 사용이 필수가 아니지만, JS 코드 안에서 UI관련 작업을 할 수 있기 때문에 시각적으로 더 도움이 된다. 또한 JSX를 사용하면 React가 더욱 도움이 되는 에러 및 경고 메시지를 표시할 수 있게 해준다.
- 리액트로 개발을 할 때 HTML, CSS, JS 코드를 작성하기도 하지만 상당부분을 JSX로 코드를 작성해야한다.
- 하지만 JSX는 공식적인 JS문법이 아니기 때문에 브라우저는 JSX를 이해하지 못한다.
- 때문에 리액트로 개발을 할 때는 JSX를 브라우저가 이해할 수 있는 평범한 자바스크립트로 변환시킬 방법이 필요하다.
JSX의 장점
- 보기 쉽고 익숙하다.
- 높은 활용도
느낀점
최근에 노마드코더의 [ReactJS로 영화 웹 서비스 만들기] 강의를 보기 시작했다. 그래서 React가 무엇인지, JSX가 무엇인지 등 강의를 보고, 이해하기 위해서는 개인적으로 공부를 해야겠다는 생각이 들었다.
오늘 배운 것을 요약해보면 다음과 같다.
- JSX는 React에서 필수는 아니지만, 개발을 더 간편하기 위해 사용하는 JavaScript XML이다.
- 실질적으로 많은 개발자가 사용하기 때문에 JSX는 필수 요소라고 볼 수 있다.
- JSX는 HTML, CSS, JS가 아니기 때문에 JSX를 사용하려면 웹이 이해할 수 있는 방식으로 변환해줘야 한다.
- 보통 바벨 등으로 변환해준다.
참고
#Software Engineer #IRISH