React 개발 환경 구축하기

처음으로 React를 사용해 보게 되었다.

공식문서도 잘 되어 있고 다양한 플랫폼에서 활용할 수 있는 프론트앤드 라이브러리라고 하니 설레었다.

 

스프린트 repo를 받은 후 해당 디렉토리로 이동 후 다음 명령어를 실행하면 되었다.

npx create-react-app twittler-react

* create-react-app 이란

페이스북에서 만든 공식적인 React 웹 개발용 Boilerplate이다.

 

이후 twittler-react 디렉토리에 React 프로젝트가 생성이 된 것을 확인할 수 있다.

그리고 twittler-react 디렉토리로 이동 후 npm start를 하면 http://localhost:3000에서 실행 결과를 확인할 수 있다.

cd twittler-react
npm start

 

 

 

공식문서를 보다가 한가지 궁금한 점이 생겼다.

새로운 app을 만들 수 있는 방법으로 다음의 방법들이 있다고 명시되어 있었다.

//npx
npx create-react-app my-app
//npm
npm init react-app my-app
//yarn
yarn create react-app my-app

*npx

JavaScript 패키지 관리 모듈일 npm(Node Package Module)의 5.2.0 버전부터 새로 추가된 도구이다.

즉, npm 에서 제공하는 하나의 도구이다.

 

 

코드스테이츠에서는 항상 npm 키워드를 계속 사용했었는데 왜 이번 과제에서는 npm init 이 아닌 npx 키워드를 사용하는 걸까?

 -> "npx로 create react app을 사용하면 훨씬 더 간편하게 template을 제공해주기 때문에 더 용이하게 사용됩니다."

       -> npm, npx, yarn 으로 create react app을 할 수 있는데, 그럼 어떤 방식으로 하느냐에 따라 template이 달라지나? 그럼 차후에 사용할 react app에 영향을 주게 되는 건가?

 

 

npx create-react-app twittler-react 라고 명령어를 입력한 후 twittler react 라는 디렉토리가 생성되면서 react 프로젝트가 생기게 된다.

근데 정확히 어떤 경로를 통해서 react 프로젝트를 가져오는거지?