FIRST APP

첫 React 앱은 “root에 App 컴포넌트를 붙이는 흐름”을 이해하면 보인다

파일을 수정했을 때 화면이 바뀌는 이유는 JSX가 컴포넌트로 실행되고 root DOM에 렌더링되기 때문이다.

HTML 진입점

브라우저가 빈 root 영역을 가진 기본 문서를 먼저 연다.

public/index.html

렌더 연결

React가 root DOM을 찾고 App 컴포넌트를 연결한다.

src/index.js

화면 작성

JSX로 제목, 문단, 버튼 같은 화면 구조를 표현한다.

src/App.js

스타일 적용

컴포넌트에서 CSS를 import해 화면 표현을 바꾼다.

src/App.css

학습 기준: 모든 문법을 외우기보다 수정한 JSX가 어떤 DOM 결과로 이어지는지 먼저 감각으로 잡는다.