나의 첫번째 리액트 컴포넌트

React를 설치하고 나서, 이제 VScode를 통해서 실행시켜준다.

cd 내 파일경로명, yarn start로 서버를 가동시켜준다.

그러면 동글동글 돌아가는 리액트가 나온다.

이건 개발자가 만들어 준 거기 때문에 이제 나의 컴포넌트를 새로 만들어보자 

바벨이란 도구를 사용해서 JSX문법이 JS로 전환이 된다.

 

import와 expoert 로 주고 내보내기가 가능하다.

 

JSX에서 주석을 사용하는 경우에는 /* */ 기존처럼 주석을 사용할 수 있지만, 여기에 { } 중괄호로 한번 더 감싸주어야만 화면에 출력되지 않고, 제대로 된 주석이 작성이 가능하다.

또한 // 셀프클로징 주석도 사용이 가능하다.

JSX에서 지켜져야 할 규칙

<div>태그는 꼭 닫혀야 한다!</div> or <Hello /> 이런식으로 해줘야만 에러가 발생하지 않는다.