create-react-app
리액트 앱을 만들기 위해 Create React App이라는 Node.js 라이브러리를 이용한다. 이는 복잡한 설정 없이 리액트 앱을 만들어 주는 고마운 라이브러리이다. Create React App은 보일러 플레이트이다. 복잡한 설정 없이 쉽게 프로젝트를 생성하도록 돕는 개발 도구를 보일러 플레이트라고 한다. '보일러를 찍어내는 틀'이라는 의미를 담고 있다. 줄여서 CRA라고도 한다. CRA는 리액트를 개발하고 운영하는 Meta(전 페이스북)가 직접 개발하고 운영하는 공식 보일러 플레이트이다.
- 터미널을 열고 명령어를 입력한다.
- npx create-react-app . // 점(.)은 현재 폴더를 의미한다.
- npx(Node Package Excute)는 '노드 패키지 실행'이라는 뜻의 명령어이다.
- 항상 최신 버전의 리액트 앱을 생성하기 위해서는 npx 명령을 이용해야 한다.
- npm run start
- 내장된 웹 서버가 실행되면서 리액트 앱 실행
- 자동으로 크롬 웹 브라우저에서 새 탭이 열리면서 접속
- ctrl + c - (Y/N)
- 현재 작업(리액트 앱)을 종료할 것인지 묻는 명령어
- y 입력하면 종료된다.
Create React App은 리액트 앱을 생성함과 동시에 앱이 동작하는 데 필요한 파일과 폴더를 자동으로 생성한다. 이런 파일과 폴더 모음을 '템플릿'이라고 한다.
- src 폴더는 소스(source) 폴더라는 뜻으로 프로그래밍 소스를 저장하는 폴더이다. 이 폴더는 리액트를 사용하는 동안 자바스크립트 파일들을 한데 모아놓는 곳으로, 프로젝트에서 사용할 소스 파일을 저장한다.
'기술 > React' 카테고리의 다른 글
| [React] 리액트 라이프 사이클 - useEffect (0) | 2024.02.22 |
|---|---|
| [React] List와 key의 중요성 (0) | 2024.02.20 |
| [React] 가상 돔 (Virtual DOM)이란 무엇일까? (0) | 2024.02.20 |
| [React] 리액트란? (0) | 2024.01.16 |
| [Node.js] Node.js란? (0) | 2024.01.15 |