(React) create-react-app

React 간결하게 개발 환경 구축

리액트 개발을 위해서는 환경을 구축해야 한다.

이를 위해서는 별도의 툴을 설치해야 한다. (예를 들어 JSX를 자바스크립트로 변환하는 Babel)

패키지

페이스북에서는 별도의 설정이나 설치없이 곧바로 원활한 리액트 개발이 가능하도록 패키지를 제공한다.

간편하게 환경을 구축할 수 있어 더 수월한 개발을 할 수 있다.

Github 링크 : https://github.com/facebook/create-react-app

사용법

사용에 앞서 기본적으로 컴퓨터의 Node가 6버전 이상이어야 한다.

터미널에 아래 명령어를 입력하면 된다.

  • React 앱 생성

    아래의 방법 중 한가지를 택하여 실행한다.

    • npx을 이용
    npx create-react-app my-app
    
    • npm을 이용
    npm init react-app my-app
    
    • yarn을 이용
    yarn create react-app my-app
    

    위 방법을 통해 my-app이란 이름의 디렉토리가 생성된다.

    생성된 디렉토리에는 리액트 개발에 필요한 기능과 툴이 전부 세팅되어 있다.

    별도의 설정이 필요없이 곧바로 개발에 매진하면 된다!

  • React 앱 실행

    작성한 앱을 실행하기 위해서는 터미널에

    npm start
    

    또는

    yarn start
    

    을 입력한다.

    명령을 실행하면

    브라우저의 http://localhost:3000/ 페이지에 앱이 실행된다.

    코드를 작성할때마다 자동으로 페이지를 갱신한다. 즉, 즉각적으로 페이지의 변화를 확인 할 수 있다.

더 자세한 내용과 사용법은 페이스북의 Github에 올라와 있는 문서를 참고 하면 된다.