프로젝트/ToDoApp프로젝트-Spring

[To Do App] 프론트엔드 개발 환경

sintory-04 2025. 1. 2. 17:53

HTML, TypeScript, CSS, React 로 개발할 것임.

 

1. NodeJS 설치

- 20 버전으로 설치

 

2. 설치 후 cmd 에서 node와 npm 버전 확인 (설치 확인하는 것)

npm -v
node -v

 

3. 타입스크립트 설치

npm install -g typescript

 

 

4. 리액트와 타입스크립트 프로젝트 설치

- 새로운 파일 지정 후, front 전용 폴더 생성 할것임.

- 일단 본인은 npm 으로 create-react-app 폴더 생성에 의존성 문제가 너무 많아 yarn을 통해 설치할 예정

// yarn 설치
npm install -g yarn

// react-app 만들면서 template을 typescript로 하기
yarn create react-app todoapp-front --template typescript

// 그 후시작
cd todoapp-front
yarn start

 


5. 그러면 개발 환경은 끝! 불필요한 파일은 삭제하면 됨.