https://github.com/trustyoo86/react_reflux_demo
https://github.com/trustyoo86/react_reflux_demo
Last synced: 2 months ago
JSON representation
- Host: GitHub
- URL: https://github.com/trustyoo86/react_reflux_demo
- Owner: trustyoo86
- Created: 2016-01-13T12:18:41.000Z (over 9 years ago)
- Default Branch: master
- Last Pushed: 2016-04-08T18:03:24.000Z (about 9 years ago)
- Last Synced: 2025-02-07T11:53:10.014Z (4 months ago)
- Language: JavaScript
- Size: 27.3 KB
- Stars: 3
- Watchers: 3
- Forks: 1
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
React + Reflux + Node JS Demo
=====================
React를 기반으로 한 MVC 및 Websocket을 활용한 Boilerplate입니다.
개요
=====================
**적용기술**
SPA를 구현하기 위한 기술은 다음과 같습니다.
React : View Component를 구현합니다.
Reflux : Flux와 유사하게 Store, Action을 통해 비동기적으로 Modal을 구현합니다.
superagent : REST api 를 구현하기 위한 라이브러리를 사용했습니다.
socket.io : Websocket을 구현하기 위해 Server 및 Client측에서 사용합니다.
React-bootstrap : 기본 View 구조및 디자인을 하기 위해 bootstrap react component를 사용합니다.
Webpack : 파일 및 css의 build 또는 dev-server를 통한 개발환경 구축에 사용하였습니다.
**현재 구현 범위**
현재 구현 범위는 다음과 같습니다.
src/component/Header : react-bootstrap을 통해 Header Component를 구현했습니다.
src/component/ModalPopup : react-bootstrap을 이용한 modal을 공통으로 사용하기 위해, component로 분리하였습니다.
src/utils/Connection : superagent를 사용한 REST api GET, POST 및 socket.io를 사용하여 Websocket object를 생성합니다.
**사용법**
git repository를 clone 하신 후, npm install을 실행합니다.
npm install
다음과 같은 명령어를 통해서 현재의 Boilerplate가 사용가능합니다.
npm start : webpack dev server를 활용하여 실시간으로 파일을 빌드 및 실행해볼 수 있습니다. (http://localhost:3000 으로 접속)
npm run dist : 빌드 파일 배포시에, 이 실행어로 실행하면, dist 폴더에 빌드 파일이 생성됩니다.