技術棧：react、react-router4.x 、 react-redux 、 webpack3.x、 redux-saga 、 css-module 、 ES6 、babel...
在慕課網看到相關視訊，但是我等屌絲碼農真心買不起這個價位的視訊。有幸看到原始碼，但是看到程式碼的我。。。也不是很苟同上面程式碼中react技術棧這一套使用方式。遂自己寫了一個demo。
專案截圖
- 載入
- 首頁
- 詳情頁
- 城市選擇
專案執行展示(gif)
流量黨慎入
專案內容不多，就涉及到三個頁面，主要是為了學習新的知識。專案中用的redux-saga也是前天才學習的。專案的架構也是最近在各種探討研究。還求大神多指點~
專案技術總結
專案簡單說明
開發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技術棧完成。
(^_^)/~~
喜歡的朋友歡迎關注微信公眾號：前端的全站之路
