React技術棧實現XXX點評App demo

項目地址：https://github.com/Nealyang/R...
技術棧：react、react-router4.x 、 react-redux 、 webpack3.x、 redux-saga 、 css-module 、 ES6 、babel...

---

一同窗習react、node的同窗歡迎加入：

Node.js技術交流羣：209530601

React技術棧：398240621

---

項目截圖

加載：

首頁：

詳情頁：

城市選擇：

項目運行展現(GIF)

流量黨慎入

app運行展現

state樹變化

項目內容很少，就涉及到三個頁面，主要是爲了學習新的知識。項目中用的redux-saga也是前天才學習的。項目的架構也是最近在各類探討研究。還求大神多指點~

項目技術總結

• react技術棧項目結構探究

• redux-saga初體驗

• 關於項目中webpack的配置說明

項目簡單說明

• 開發react-redux這一套，我我的的理解是 Redux體現的是代碼分層、職責分離的編程思想,邏輯與視圖嚴格區分。 而某網上的這一套代碼，邏輯都寫到了view組件層，組件須要關心如何獲取數據，如何處理數據，這樣的組件層是不容易複用的，Redux的使用也是殘缺的。甚至這種狀況，你不用Redux，直接定義一個全局的state變量，全部組件都來直接操做它好了。

• 項目還有許多須要完善的地方，redux-saga的使用方式、項目結構、包括webpack3.x配合react的代碼優化以及react的Universal渲染甚至後端Node的代碼編寫。歡迎各路大神前來指教~

項目實現

• react熱更新

• css-module使用

• react-redux異步處理

• react-router 瀏覽器傳參、獲取

• redux-saga輔助

• 上拉加載更多

• 全局監控Loading

• ......

• Universal渲染 可參考我另外一個項目webpack1.x

安裝步驟

# clone this demo 
git clone ...

# install dependencies
npm i (or yarn)

# serve with hot reload at localhost:8000
npm start

more

後續會繼續改進技術，若是有時間會寫一個全棧的demo，着重後端Node和mongo的使用。前端依舊使用react技術棧完成。

(^_^)/~~