리액트 사용하기_2

리액트 사용하기_2 :

- 리액트 콤포넌트 만들기 및 props속성 사용.

- 콤포넌트 파일로 분리하기.

--------------------------------------------------------------

개발언어: JSX(페이스북에서 만든 Javascript 문법 확장판) = react-scripts 버전 3.4.0

개발환경: VSCode IDE사용, create-react-app 앱사용.(npm run start 실행결과 크롬에서 정상 출력됨. 단, IE브라우저에서는 실행 않됨)

실행환경: React(서버:npm install -g serve앱 설치 후  serve -s build 사용. 또는,1회용 서버생성 npx serve -s build )

리액트버전: create-react-app --version 3.4.0 ( 설치방법: npm install -g create-react-app )

--------------------------------------------------------------

-순서1: index.html -> index.js 확인(아래)

-순서2: design_main.html (디자인 퍼블리싱파일) 분해 -> App.js 에 헤더/메뉴/콘텐츠/메인 콤포넌트 생성(JSX코드).

Ps. 크롬 웹 스토어에서 확장프로그램 react developer tools 을 설치 하면, 좀더 향상된 디버깅을 할 수 있습니다.(아래)