React를 시작하는 방법

React 환경 구축 절차를 소개합니다.
처음이라도 알기 쉽게 쓰려고 생각하기 때문에
뭔가 있다면 코멘트에 부탁드립니다.

목차

Node.js 설치

yarn 설치

Create React App 설치

0. 소개

Windows10을 사용하고 있습니다.

1. Node.js 설치

htps : // 그래서 js. 오 rg / 그럼 /
에서 Node.js를 설치합니다.

여기에서는 LTS(권장 버전)를 설치합니다.

설치 후 명령 프롬프트를 열고 node를 입력합니다.

C:¥Users>node

설치가 성공하면

C:¥Users>node
Welcome to Node.js v14.15.4.
Type ".help" for more information.

그리고 나옵니다. (버전은 그 때때로입니다)

2. yarn 설치

htps : // c ぁし c. 또는 rn pkg. 코 m / 엔 / 도 CS
참고로 yarn을 설치합니다.

yarn은 명령 프롬프트에서 설치합니다.

명령 프롬프트에 npm install --global yarn을 입력합니다.

C:¥Users>npm install --global yarn

설치에 성공하면

C:¥Users>npm install --global yarn
> [email protected] preinstall C:\Users\AppData\Roaming\npm\node_modules\yarn
> :; (node ./preinstall.js > /dev/null 2>&1 || true)

C:\Users\AppData\Roaming\npm\yarn -> 
C:\Users\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js
C:\Users\AppData\Roaming\npm\yarnpkg -> 
C:\Users\AppData\Roaming\npm\node_modules\yarn\bin\yarn.js
+ [email protected]
added 1 package in 0.658s

그리고 나옵니다.

3. Create React App 설치

htps : // 그럼. Rea ctjs. 오 rg / 두 cs / c 레테 - 아-네 w- 리 아 c- p p. HTML
참고로 Create React App을 설치합니다.

여기도 명령 프롬프트에서 설치합니다.

명령 프롬프트에 npx create-react-app 〇〇〇를 입력합니다.
(〇〇는 설치할 파일의 이름이 되므로 좋아하는 것을 넣어 주세요.)

여기에서 React 사이트에 있는 대로 npx create-react-app my-app를 입력합니다.

C:¥Users>npx create-react-app my-app

C:¥Users>npx create-react-app my-app
yarn add v1.22.10 in 10.273s
[1/4] Resolving packages...
[2/4] Fetching packages...
info There appears to be trouble with your network connection. Retrying...
info [email protected]: The platform "win32" is incompatible with this module.

（途中省略）

We suggest that you begin by typing:

  cd my-app
  yarn start

Happy hacking!

도중은 생략하고 있습니다만, Happy hacking! 라고 나오면 인스톨 완료입니다.

다음에, 말했듯이 「cd my-app(스스로 지정했을 경우는 cd 〇〇)」라고 넣습니다.

C:¥Users>cd my-app

앱이 들어 있는 디렉토리를 지정할 수 있습니다.

C:¥Users¥my-app>

yarn start를 입력합니다.

C:¥Users¥my-app>yarn start

C:¥Users¥my-app>yarn start
yarn run v1.22.10
$ react-scripts start

(途中省略)

Starting the development server...
Compiled successfully!

You can now view my-app in the browser.

나오기 때문에 탐색기
C\Users\my-app에 있는 src\App.js를 엽니다.



여기에서는 Visual Studio를 선택했습니다.



이 화면이 나오면 종료입니다.
코드를 엉망으로 반영되는 것이 변경되었는지 확인하십시오.

도움이 된 기사 : h tps:// 퀵했다. 작은 m / rspm 하라다 7645 / MS / 25C496 감히 87973b C7 A5#