*** 노마드코더에서 무료로 강의해주는 ReactJS 강의를 보고 개인적으로 정리한 내용입니다. ***
Component는 UI를 재사용 가능하도록 나눈 조각들이다.
다시 말해, React를 이용해 웹으로 표현되는 모든 것들은 각각의 component이다.
관념적으로 표현하자면 위와 같고,
조금 code적(?)으로 접근하자면
component는 "HTML을 반환하는 함수"이다.
위 코드는 react를 setup했을 때 기본적으로 설치되는 index.js 파일의 내부이다.
이 코드의 <App / > 부분을 통해서 App이라는 함수가 실행된다.
이 "App"이 "component"가 된다.
즉, component를 사용해서 HTML을 보다 편하게 사용할 수 있게 된다.
그렇다면 App의 모습을 볼 필요가 있겠다.
위 코드는 실질적으로 실행되는 App.js의 내부이다.
App()이라는 함수가 있는데, 신기하게도 반환값이 HTML이다.
(이래서 component는 HTML을 반환하는 함수라고 표현했던 것이다.)
기존의 Javascript에서 찾아볼 수 없는 형태이다.
이런 javascript와 HTML의 조합을 "jsx"라고 부른다.
JSX는 react에서만 존재하는 유일한 개념이니, 다른 프레임워크(vue, angular 등등)
에서는 적용되지 않음을 꼭 알고 있자.
끄적끄적....