--引言
很多人初次上手，或許不知道react到底該怎么學(xué)習(xí)，使用react你需要掌握幾十個知識點。開發(fā)環(huán)境對新手來說都是一個不小的挑戰(zhàn)，我們需要nodejs，然后還要嘎嘣脆的python做webpack打包，還需要ruby的一些組件，然后還有es6，promise，router，express，koa；是不是很眼花繚亂，也很頭大。所以對你們來說，你們需要一個簡單、通俗、易懂（明明是一個意思）的框架來幫助你們，成功的一小步就是能做點東西出來，不是么。
</br>
React Starter Kit — "isomorphic" web app boilerplate
</br>
React-starter-kit是一個快速搭建webapp的框架，他集成了諸如Node.js，React.js，Express， Flux，ES6+， JSX，Babel， PostCSS，Webpack, BrowserSync... ，目的就是給大家一個思路，什么功能用什么工具。
需求
- Mac OS X, Windows, or Linux
- Node.js v5.0 or newer
- npm
v3.3 或者更新的版本 (new to npm?) - node-gyp
prerequisites mentioned here - 一款支持React/JSX/Flow/ESlint 等的IDE工具(learn more)
項目結(jié)構(gòu)
在開始之前我們先看看他的目錄結(jié)構(gòu)
<pre>提示：該版本內(nèi)并沒有包含一款flux流控制器，你可以選擇當(dāng)前一些主流的組件
例如Flux, Redux, 和Relay等..
這些組件都可以很好的幫助你處理業(yè)務(wù)間的扭轉(zhuǎn)</pre>
開始
- 下載最新的版本
你可以通過git命令去clone最新的React Starter Kit（RSK）版本
<pre>
$ git clone -o react-starter-kit -b master --single-branch \
https://github.com/kriasoft/react-starter-kit.git MyApp
$ cd MyApp
</pre> - 安裝npm組件
項目所依賴的組件在package.json中可以查看，他包含運行依賴和調(diào)試依賴，可以通過如下命令安裝(在package.json所在目錄執(zhí)行)
<pre>
$ npm install
</pre> - 運行
<pre>
$ npm start
</pre>
這個命令會編譯源碼（/src）到生成目錄（/build），在編譯完成后，會啟動一個node服務(wù)器 (node build/server.js)，在這之上，會運行Browsersync
http://localhost:3000/ — Node.js server (build/server.js)
http://localhost:3000/graphql — GraphQL server and IDE
http://localhost:3001/ — BrowserSync proxy with HMR, React Hot Transform
http://localhost:3002/ — BrowserSync control panel (UI)
現(xiàn)在你可以在瀏覽器或者移動端上打開你的網(wǎng)頁，修改代碼后，代碼會自動編譯，并提交到瀏覽器當(dāng)中，自動刷新。這一切都是自動的，也就是說我們只需要啟動一次服務(wù)，就可以一直調(diào)試下去，這一切都是HMR 帶來的特性。
前面提到的npm start是在開發(fā)的時候用的，他會編譯出沒有經(jīng)過壓縮、優(yōu)化的文件，供我們開發(fā)調(diào)試使用。
如果要編譯系統(tǒng)上線的版本，我們需要添加release命令，通過npm start -- --release
<pre>
$ npm start -- --release
</pre>
編譯、調(diào)試、部署
如果你只想編譯你的代碼 (不想啟動一個開發(fā)服務(wù)器), 只需要執(zhí)行:
<pre>$ npm run build</pre>
如果要編譯一個運行版本:
<pre>$ npm run build -- --release</pre>
在運行了這個命令之后, 這個文件夾下 /build
就會包含編譯的運行版本.
.
檢查錯誤的源代碼和運行的潛在問題:
<pre>$ npm run lint`</pre>
執(zhí)行單元測試:
<pre>$ npm test # Run unit tests with Mocha
$ npm run test:watch # Launch unit test runner and start watching for changes</pre>
默認(rèn)情況, Mocha 會去查找這個文件 src/**/*.test.js. 參考這個例子 atsrc/components/App/App.test.js.
測試框架可以自行更換為更優(yōu)秀的AVA，這個具備比Mocha更高的效率，并且支持ASYNC等異步語法
發(fā)布你的應(yīng)用, 執(zhí)行:
<pre>$ npm run deploy</pre>
