리액트 JSX 문법 (ClassName,데이터바인딩, 스타일적용방법)

1.ClassName

<div calss="black-nav">
        <h4>블로그임</h4>
        </div>
자바스크립트에서
이렇게하던걸 아래처럼 써야됍니다

<div calssName="black-nav">
        <h4>블로그임</h4>
        </div>

2.데이터바인딩

let post = '강남 우동 맛집';
  document.querySelector('h4').textContent=post

자바스크립트에서는 document에서 가져온거

<h4>{post}<h4>하면 끝남

변수넣을땐 {중괄호}
전문용어로 데이터바인딩이라고함.

3.스타일적용방법

 <h4 style={{ color: red, fontSzie: '16px' }}>블로그임</h4>

style 넣을때는 이렇게하면댐 중괄호안에 오브젝트 형식으로 넣어야함
font-size 말고 fontSize라고입력해야함 카멜머시기라고함