[백엔드 개발자의 프론트 도전기] 1. 설정

windows 환경에서 설정을 시작했다.

 

처음에는 배포를 위해 Docker를 먼저 깔았으나,

나중에 실제 배포 시 제대로 설정 하는걸로 결정.

 

1. npm 설치 : 사이트에서 다운로드 받아 설치하면 된다.

2. powershell 접속

3. "npm install --global yarn" : npm으로 yarn을 설치한다. global로 설치해야 전역에서 yarn을 인식할 수 있다.

4. "npm install -g create-react-app" : 리액트 앱을 생성하는 명령어 다운로드

5. "create-react-app [원하는 app 이름]" : 원하는 위치로 이동해 설정하고 싶은 app 이름의 리액트 앱을 생성한다.

                                                                  * 여기서는 "hello-world"라는 이름으로 생성하였음.

6. "cd [설정한 app 이름]" : 방금 생성한 폴더(여기선 hello-world 폴더)로 이동

7. "yarn start" : compiled successfully! 라는 문구가 뜨면 정상적으로 실행되는 것.

8. 접속을 통해 확인하기 : 아래와 같은 문구가 뜰텐데, 여기서 보고 둘 중 하나를 선택해 접속하면 된다.

  You can now view hello-world in the browser.

  Local:                    http://localhost:3000
  On Your Network:  http://[ip 주소]:3000