JSX란?
JavaScript + XML
자바스크립트를 확장한 문법.
자바스크립트의 모든 기능이 포함되어 있으며, React Element를 생성하기 위한 문법
엘리먼트는 단순히 화면에 그려지는 HTML적 요소라고 생각하면 쉽다.
리액트는 단 하나의 html파일만 존재한다.(public폴더 내부의 index.html)
그럼 그릴거리가 없는데 브라우저는 어떻게 화면을 그릴 수 있을까?
=> JSX 문법을 사용해서 React 요소를 만들고 DOM에 렌더링 시켜서 그린다.
기본적인 JSX 문법
1) 태그는 꼭 닫아주기
2) 컴포넌트에서 최상위 엘리먼트는 반드시 하나만 반환하기
3) JSX에서 javascript 코드를 가져오거나, 사용하려면 '{}' 사용하기
4) 태그에 class를 부여할 때는 "class" 대신에 "className"
5) style 속성을 줄 때, css문법 대신에 json 형식으로 객체에 key-value로
