Flux 시작하기.

이제 Flux의 기본 요소의 역할을 알았으니 실제로 코드를 작성해보자.

Flux의 구조를 직접 만들 수도 있지만 Github에 등록된 코드로 시작해보자.

위 링크를 통해 Flux의 기본 세팅을 받을 수 있다.

TODO를 모두 작성한 APP은

에서 받을 수 있다.

pull 받아서 시작해보자.

기본적으로 Build 도구는 WebPack을 사용하며 React를 View FrameWork로 사용하고 있다.

Pull을 받았다면 npm install을 해서 의존 라이브러리들을 받아주자.

그리고 기본 코드는 js폴더 밑에 있으며 WebPack을 통해 빌드된 코드들은 dist폴더 아래에 위치하게 된다.

js폴더 아래를 보게되면

폴더가 있다.

entry Point(로직의 시작점)은 app.js이다.

webpack.config.js를 보면 webpack설정이 간단하게 되어 있다.

entry point를 app.js를 보고 빌드 output파일은 /dist/scripts/bundle.js를 보고 JSX Build 파일은 모든 .js파일인데 node_modules폴더는 ignore시켰다.

package.json을 보면 의존 모듈과 CLI 커맨드가 적혀있는데

npm start하면 서버를 띄울 수 있고 포트는 기본적으로 8000번이다.

그래서 http://localhost:8000으로 접속하면 dist/index.html이 보일것이다.

이렇게 기본적인 flux 프로잭트를 시작할 수 있다.

우리는 TODO 앱을 만드는것을 시작할 것이다.