[React] React에서 쓰이는 JSX 문법

html 대신 사용하는 JSX 문법

---

JSX (JavaScript XML)는 

javascript안에서 html을 쉽게 작성할 수 있는

언어(?)와 같은 역할을 한다.

원래 React에서 <div>를 만들려면 

 

React.createElement('div',null, 'Hello world')

 

 와 같은 방식으로 해야한다고 한다. 

하지만
JSX를 사용한다면 

 

<div></div>

 

내가 평상시에 html에서 쓰던 방법과 똑같은 걸 알 수 있다. 

---

우선 jsx 문법 3가지에 대해 적어본다면 

1. html에서의 class는 className으로 

2. 변수를 html에 넣을때는 {중괄호} 안으로

3. html에 style속성을 넣을 때에도 style = {  {color : ' ' , fontSize : ' px' } } 로 나눌 수 있다.