[React] React, JSX

React의 특징 세가지.

• 선언형
  -> 코드가 명시적으로 작성되어 직관적입니다.

• 컴포넌트 기반
  -> 컴포넌트 단위로 개발 할 수 있어 독립성과 재사용성을 가집니다. 이로인해 기능 작동에 집중된 개발, 유지 보수, 유닛테스트에 용이합니다.

• 범용성
  -> 안정적이고 가장 유명합니다. 또한 리액트 네이티브로 모바일 개발이 가능합니다.

JSX

JSX는 html과 js를 결합해놓은 파일이라고 볼 수 있습니다. 하지만 html파일은 아니기 때문에 babel 이란 컴파일러가 중간에서 브라우저가 이해할 수 있게 해석해줍니다.

JSX 규칙

• 하나의 엘리먼트에 모든 엘리먼트가 포함되어야 합니다.

<div>
	<p> 이러면 </p>
</div>
<div>
	<p> 안됩니다</p>
</div>

• css 클래스 사용시 class가 아닌 className 사용해야합니다.
  만약 class 사용하면 JavaScript의 class로 인식하게 됩니다.

• JavaScript를 쓸 때는 중괄호로 묶어야합니다. 그러지 않으면 일반 텍스트로 인식됩니다.

• 컴포넌트를 정의할땐 첫글자는 대문자로! 소문자로 정의되면 html 엘리먼트로 인식됩니다.

• 조건부 렌더링엔 if문 대신 삼항연산자를 사용합니다.

• 여러개의 html 엘리먼트를 반복적으로 표시할 때는 map() 함수를 사용합니다.
  사용할때는 반드시 key 속성을 넣어야 경고를 막을 수 있습니다.