CRA의 대체로 나온 Vite를 사용해볼 것이다. Vite는 CRA보다 속도가 빠르고 메모리를 적게 잡아먹는다는 장점이 있다고 한다.
프로젝트 만들기
npm create vite@latest
위 명령어를 입력하면 프로젝트를 만들 수 있는데 설정해주어야 할 것이 몇 개 있다.
Project name
- 따로 설정해주지 않으면 vite-project로 생성된다.
Select a framework
- 방향키를 이용하여 아래의 목록 중에 원하는 프레임워크를 선택하면 된다.
Select a variant
- 자바스크립트/타입스크립트 중에 선택할 수 있고 SWC를 사용할건지 선택할 수 있다. SWC에 대한 설명은 여기로
리액트 프로젝트 실행
vite-project 폴더로 이동해서 필요한 패키지를 설치하고 실행시켜보자.
cd vite-project
npm install
npm run dev
Vite는 CRA와는 달리 5173 포트를 사용한다.
리액트 로고가 빙글빙글 돌아가며 잘 실행되는 것을 확인할 수 있다.
[참고]
'프로젝트 > 트위터 클론코딩 JJack' 카테고리의 다른 글
[Firebase] Firestore storage/object-not-found 에러 해결 (0) | 2023.11.25 |
---|---|
[React] Each child in a list should have a unique "key" prop. (0) | 2023.11.24 |
[React] styled components에서 폰트 적용하기 (0) | 2023.11.23 |
[Firebase] Missing or insufficient permissions. 에러 (1) | 2023.11.20 |
[Firestore] Full Text Search 불가능 문제 (0) | 2023.11.16 |