[React] 프로젝트 환경 설정

1. Node.js 설치

https://nodejs.org/ko/download/

다운로드 | Node.js

운영체제에 맞는 Installer를 선택 후 설치한다.

---

2. Yarn 설치

https://classic.yarnpkg.com/en/docs/install#windows-stable

Yarn

운영체제에 맞는 방식에 따라 설치하면 된다. 나는 cmd 창에서 아래 명령어를 입력하여 설치했다.

npm install --global yarn

---

3. Visual Studio Code 설치 및 Plug In 설치

https://code.visualstudio.com/

Visual Studio Code - Code Editing. Redefined

확장 프로그램(Plug In) 설치

 

1. Relative Path
   • https://marketplace.visualstudio.com/items?itemName=jakob101.RelativePath
2. Guides
   • https://marketplace.visualstudio.com/items?itemName=spywhere.guides
3. vscode-js-import
   • https://marketplace.visualstudio.com/items?itemName=wangtao0101.vscode-js-import
4. CSS Formatter
   • https://marketplace.visualstudio.com/items?itemName=aeschli.vscode-css-formatter
5. className Completion in CSS
   
   • https://marketplace.visualstudio.com/items?itemName=aeschli.vscode-css-formatterd

---

4. React Extension Pack 설치

https://marketplace.visualstudio.com/items?itemName=jawandarajbir.react-vscode-extension-pack

React Extension Pack - Visual Studio Marketplace

---

5. create-react-app 설치

React 앱을 만들어주는 도구이다.

cmd 창에 아래 명령어를 입력한다.

npm install -g create-react-app

yarn global add create-react-app

---

6. React Developer Tool 설치

Chrome에 React Developer Tool을 설치한다.

https://chrome.google.com/webstore/detail/react-developer-tools/fmkadmapgofadopljbjfkapdkoienihi?hl=ko 

React Developer Tools

 

7. Redux DevTools 설치

https://chrome.google.com/webstore/detail/redux-devtools/lmhkpmbekcpmknklioeibfkpmmfibljd

Redux DevTools