[코인거래웹서비스-프로젝트] 1. 초기 설정

1. Vite로 프로젝트 생성

npm create vite@latest swe-project -- --template react

npm create vite

터미널에서 해당 코드를 실행하면 'swe-project' 명으로 react template의 프로젝트가 생성된다.

생성된 파일을 확인해보면 다음과 같다.

구성 파일

RCA로 생성한 것과 비슷한 구성을 가졌지만 확실히 가벼운 느낌이 있다.

---

2. Vite 시작 테스트

npm install

터미널

node_modules 생성

npm install 명령어를 통해 node_modules가 생성되었다.

npm run dev

터미널 실행 결과

5173 port에 화면이 나타난다.

RCA에서 npm start를 하면 자동으로 화면이 나타나지만 Vite는 바로 안 나타난다.

(오히려 좋아)

Cmd+click으로 링크를 열 수 있다.

vite+react

정상 동작함을 확인할 수 있다.

심지어 실시간 편집을 바로 반영할 수 있다.(가볍다길래 안될 줄)

 

App.jsx 편집

 

간단하게 <h1> 태그를 추가해서 결과를 확인해보면

터미널 화면

어디가 수정되었는지 로그도 제공한다. 오히려 좋은데?

수정 화면

이제 본격적으로 프로젝트를 시작해보자