[React] 리액트 개발환경 설정 (Node.js, VSC, Chrome)

목차

⭐요약

리액트 개발 환경 설정부터 명령어를 간단히 정리함. VS Code를 기준으로 설명함.

 

 

---

리액트란?
▷ 페이스북에서 나온 사용자 인터페이스 빌드를 위한 자바스크립트 라이브러리 -위키백과-

 

⭐리액트

1) 개발 환경 설정

• Node.js 설치
• VS Code 설치
• Chrome 설치

위의 세 가지를 설치함. Node.js에 관한 설치는 링크를 참고함.

 

 

2) 실행 과정

1. 프로젝트 폴더 생성
2. VS Code로 폴더 열기
3. View - Terminal에 npm init react-app . 입력
4. create-react-app 설치
5. npm run start 입력으로 프로젝트 실행
6. js 파일을 수정하여 작업
7. 터미널 창에서 Ctrl + C를 눌러 작업 종료

 

 

3) 명령어 정리

• 리액트 프로젝트 생성: npm init react-app .
• 개발 모드 실행: npm run start
• 개발 모드 종료: Ctrl + C

 

⭐참고 자료

1) React, https://ko.reactjs.org/

2) 군만두의 IT 개발 일지, "[Node.js] 노드 설치 및 환경설정", 2022.07.18, https://mandusitstudy.tistory.com/2