vs code - React 세팅

바닐라스크립트를 이용해서 데이터를 입력할 위치를 찾고 해당 데이터를 다운받은뒤 데이터를 넣어 렌더링 하는 과정은 생각보다 많이 귀찮다.
입력할 데이터가 한 둘이 아니라면 많은 시간이 소요된다.
이러한 단순한 반복을 리액트를 이용해서 간단하게 해결할 수 있다

먼저 Node.js 가 설치되어 있어야 함

• 검색해서 스크롤 내리면
  
• 아래코드 복사
  
• vscode 터미널에 실행

$ npx create-react-app my-app

Creating a new React app in C:\workspace\javascript_lab\ex02\my-app.

Installing packages. This might take a couple of minutes.
Installing react, react-dom, and react-scripts with cra-template...


added 1416 packages in 42s

231 packages are looking for funding
  run `npm fund` for details        

Initialized a git repository.

Installing template dependencies using npm...

added 55 packages in 5s

231 packages are looking for funding
  run `npm fund` for details
Removing template package using npm...


removed 1 package, and audited 1471 packages in 2s

231 packages are looking for funding
  run `npm fund` for details

6 high severity vulnerabilities

To address all issues (including breaking changes), run:
  npm audit fix --force

Run `npm audit` for details.

Created git commit.

Success! Created my-app at C:\workspace\javascript_lab\ex02\my-app
Inside that directory, you can run several commands:

  npm start
    Starts the development server.

  npm run build
    Bundles the app into static files for production.

  npm test
    Starts the test runner.

  npm run eject
    Removes this tool and copies build dependencies, configuration files
    and scripts into the app directory. If you do this, you can’t go back!

We suggest that you begin by typing:

  cd my-app
  npm start

Happy hacking!

• vscode로 my-app 폴더 열기
• 터미널에 npm start 입력
  
• 기본 세팅 다운받아짐