[React] 리액트 프로젝트 생성/시작하기

1.  node.js 설치하기

1-1. 해당 사이트에서 OS에 맞는 버전을 다운받기

Node.js

 

1-2. 터미널에서 명령어를 사용하여 다운받기

 

설치가 되었는지 확인하려면 '설치한 패키지 이름 -v' 을 통해 확인 가능하다.

 

 

💡 React 프로젝트에서 사용하는 tools 종류

node JS: 자바스크립트를 실행할 수 있는 환경, 자바스크립트로 프로그래밍을 가능토록 하는 프레임워크

npm: 패키지 매니저, 라이브러리들을 쉽게 관리(설치, 삭제, 버전관리)할 수 있도록 도와준다.

npx: 설치하는 것이 아닌 우리가 원하는 라이브러리를 실행할 수 있도록 도와준다.

yarn: npm보다 성능을 개선한 새로운 패키지 매니저, npm과 호환이 가능하여 프로젝트 중에 같이 사용해도 무방하다.

 

 

 

2. React 프로젝트 생성하기

npx create-react-app 생성할프로젝트폴더이름

yarn create react-app 생성할프로젝트폴더이름

 

 

 

실습

1. 터미널에서 프로젝트를 생성하고 싶은 경로로 이동한 뒤 study-react 이름의 리액트 프로젝트 폴더 생성

 

 

 

2. 프로젝트 생성이 완료되면 아래와 같이 프로젝트시에 사용하는 커맨드 리스트가 뜬다.

 

 

3. 데스크탑에 study-react가 생성된 것을 확인할 수 있다

 

 

 

리액트 프로젝트 폴더 생성은 완료되었고 이제부터는 각자가 사용하는 코드 에디터에서 리액트 프로젝트를 실행할 수 있다.

 

 

 

 

 

 

 

📌 리액트 공식 사이트

Adding TypeScript | Create React App

 

Getting Started – React