React, [실습] 프로젝트 열기

 

React 프로젝트 생성-1

 

[실습]

프로젝트 열기

Ctrl + ` > 터미널 열기

npx create-react-app day01

 

① Ctrl + backtick(`) - 터미널 열기

② npx create-react-app day01

 

 

※ npx create-react-app day01 명령으로 프로젝트 생성 시 에러가 뜨면

[에러]

npm ERR! code ENOENT

npm ERR! syscall lstat

npm ERR! path C:\Users\bitcamp\AppData\Roaming\npm

npm ERR! errno -4058

npm ERR! enoent ENOENT: no such file or directory, lstat 'C:\Users\bitcamp\AppData\Roaming\npm'

npm ERR! enoent This is related to npm not being able to find a file.

npm ERR! enoent

 

[ 해결 방법 - 첫 번째 또는 두 번째 방법으로 해결해본다 ]

첫 번째 방법 => C:\Program Files\nodejs\node_modules 안의 npm 폴더를

C:\Users\bitcamp\AppData\Roaming\에 복사한다. 두 번째 방법 => Node를 제거하고 다시 설치해본다. ※ Nodejs 삭제

 

① 제어판 - 프로그램 삭제

 

② 아래의 경로를 찾아서 모두 삭제

C:\Program Files (x86)\Nodejs

C:\Program Files\Nodejs

C:\Users\User\AppData\Roaming\npm

C:\Users\User\AppData\Roaming\npm-cache

 

 

다운되면 시작

 

cd 프로젝트 위치

npm start

 

 

 

---

 

React 프로젝트 생성-2

 

Vite 활용 방식

 

 

기존 방식은 세팅에 시간이 오래 걸리고 다소 무겁다는 특징이 있다.

Vite를 이용하면 세팅도 빠르고 개발 단계에서도 수정사항을 빠르게 반영하여 실행 화면을 업데이트

해주기 때문에 매우 유용하다.

Vite 사용을 위해선 Node.js가 설치되어 있어야 한다.

 

 

 

작업 나가기

 

> ctrl + c

일괄 작업을 끝내시겠습니까 (Y/N)? > Y

 

cd.. 작업 위치 workspace로 맞추기

 

npm create vite@latest day01_vite

 

서버 껐다 키는거

 

1. npm start

2. npm run dev

 

** node_modules 삭제하고 가져가야된다.

이게 있어야 실행되는데 용량이 큼

 

npm start하면 시행안됨 node_modules 삭제해서

npm i 하면 다시 다운로드 된다.