create-react-app, 리액트로 클라이언트 만들기

React tool chain, create-react-app

이번 프로젝트의 클라이언트 구성에서 React.js를 사용함에 있어,
많은 툴체인 중 하나인 create-react-app를 적용하였다.
React를 배우고 있는 중이거나, 신규 싱글 페이지 앱을 만들 때 사용하라고 공식 홈페이지에서도 추천하고 있다.

다른 성격의 프로젝트를 진행하거나, 다른 툴체인이 궁금하다면 아래의 링크를 참고하면 좋겠다.
새로운 React 앱 만들기

1. 프로젝트 생성과 라이브러리 설치

   • cretate-react-app
   • npm install react-router-dom (브라우저에서 사용되는 리액트 라우터)
   • npm install cross-env --dev
     (프로젝트에서 NODE_PATH를 사용해 절대경로로써 파일을 불러오기 위해 환경변수를 설정할 때
     운영체제마다 방식이 다르기 때문에, 공통적인 방법으로 설정할 수 있게 해주는 라이브러리)
   • 필요없는 기본 생성 파일 제거

2. 컴포넌트 준비
   root 컴포넌트가 될 App 컴포넌트 먼저 생성한다.

   import React, { Component } from 'react';
   
   class App extends Component {
       render() {
           return (
               <div>
                   <ChildComponent>
               </div>
            );
       }
   }
   export default App;