목차
1. Node.js / npm 설치
2. Visual studio code 설치
3. create-react-app(CRA) 설치
1. Node.js / npm 설치
Node.js 설치를 위해 주소로 접속합니다. https://nodejs.org/en/download/
가장 최신 버전을 설치하셔도 되고 LTS Version (추천 Version) 을 설치하셔도 됩니다. 운영체제에 맞는 설치 파일을 선택하여 다운로드 설치 하시기 바랍니다.
설치화면입니다. 어디서든 command 를 사용할 수 있도록 Add to PATH 를 통해 환경 변수 추가를 하여 꼭 포함시키시기 바랍니다.
올바르게 설치가 되었는지 PowerShell 을 열어서 아래 명령어를 통해서 확인해보겠습니다.
위와 같이 나온다면 ( version 은 달라질 수 있습니다.) 올바르게 설치되었습니다.
2. Visual Studio Code 설치
Visual studio code 설치를 위해 Download Visual Studio Code - Mac, Linux, Windows 주소로 접속합니다.
운영체제에 맞는 version 을 다운로드 받아 설치합니다. 설치가 완료되면 실행을 해보도록 하겠습니다.
위와 같이 실행이 된다면 올바르게 설치되었습니다.
3. create-react-app(CRA) 설치
Node.js / npm / VS Code 이 모두 설치 되었다면 create-react-app (CRA) 를 설치 할 준비가 되었습니다.
VS Code 의 터미널을 실행하여 아래 명령어를 실행합니다.
npx create-react-app hello-world패키지를 설치해야한다고 물어보면 y 를 입력하여 계속 진행합니다.
올바르게 설치가 되었으면 아래와 같이 표시됩니다. 그후 제안 해주는 대로 명령어를 입력해보도록 합시다.
cd hello-world
npm start명령어를 실행하고 조금 기다리면 자동으로 브라우저가 실행되면서 아래와 같은 화면이 뜨게 됩니다.
create-react-app 이 설치가 올바르게 완료된 것이고 이제 react 개발 환경 구성이 완료되었습니다. 이제 react 개발을 시작 할 수 있게 되었습니다.
