React/처음 만난 리액트(react)

(실습) create-react-app

yooni825 2023. 9. 29. 15:47

React로 웹사이트 개발할 때는 주로 Create React App이라는 것을 사용

 

Create React App (CRA)

: React로 웹 애플리케이션을 개발하는데 필요한 모든 설정이 되어 있는 상태로 프로젝트를 생성해주는 도구

: npx 명령어를 이용하여 실행

 

npx

: npm 패키지를 설치한 이후에 곧바로 실행, 엑스큐트까지 해주는 명령어

: 패키지를 간편하게 한번에 처리하기 위해 사용함

 

#사용법

$ npx create-react-app <your-project-name>

 

 

명령어들

$ cd my-app

: 경로 변경 (change directory) / 현재 커맨드라인 도구가 위치한 경로를 변경하는 역할

ex) 맥의 파인더나 윈도우즈의 탐색기에 비유 -> 폴더를 더블클릭해서 안으로 들어가거나 뒤로가기 버튼을 눌러 폴더를 빠져나오는 역할을 함

 

$ npm start

: 애플리케이션 실행시키는 명령어

-> cd 명령어를 사용해서 우리가 생성한 myappproject 폴더 안으로 들어가고 이후에 npm start 명령어를 통해 리액트 애플리케이션을 실행

localhost : 현재 내가 사용하고 있는 컴퓨터

-> 현재 리액트 애플리케이션이 로컬 개발환경에서 실행된 것


실제 실습 과정 

terminal에서 npx create-react-app my-app 실행 오류 발생!!

 

해결 방법 

 

1. 전역 설치된 리액트 앱 삭제

npm uninstall -g create-react-app

 

2. npm으로 리액트 다시 설치

npm add create-react-app

 

3. 해당 작업 폴더에서 npx로 다시 설치 

npx create-react-app my-app

 

 

Result

해결 완료~!!