React技術棧實現(xiàn)XXX點評App demo

wslongchen 發(fā)布于2019-08-21 16:24 / 3321人閱讀

摘要：項目的架構也是最近在各種探討研究。還求大神多指點項目技術總結技術棧項目結構探究初體驗關于項目中的配置說明項目簡單說明開發(fā)這一套，我個人的理解是體現(xiàn)的是代碼分層職責分離的編程思想邏輯與視圖嚴格區(qū)分。前端依舊使用技術棧完成。

項目地址：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樹變化

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

項目技術總結

react技術棧項目結構探究

redux-saga初體驗

關于項目中webpack的配置說明

項目簡單說明

開發(fā)react-redux這一套，我個人的理解是 Redux體現(xiàn)的是代碼分層、職責分離的編程思想,邏輯與視圖嚴格區(qū)分。 而某網(wǎng)上的這一套代碼，邏輯都寫到了view組件層，組件需要關心如何獲取數(shù)據(jù)，如何處理數(shù)據(jù)，這樣的組件層是不容易復用的，Redux的使用也是殘缺的。甚至這種情況，你不用Redux，直接定義一個全局的state變量，所有組件都來直接操作它好了。

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

項目實現(xiàn)

react熱更新

css-module使用

react-redux異步處理

react-router 瀏覽器傳參、獲取

redux-saga輔助

上拉加載更多

全局監(jiān)控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

后續(xù)會繼續(xù)改進技術，如果有時間會寫一個全棧的demo，著重后端Node和mongo的使用。前端依舊使用react技術棧完成。

(^_^)/~~

云服務器 GPU云服務器關于點評賺錢的app react實現(xiàn)輪播圖 python實現(xiàn)棧 create-react-app

文章版權歸作者所有，未經(jīng)允許請勿轉載,若此文章存在違規(guī)行為，您可以聯(lián)系管理員刪除。

轉載請注明本文地址：http://m.specialneedsforspecialkids.com/yun/88506.html

React技術棧實現(xiàn)大眾點評Demo-初次使用redux-saga

摘要：在的中，可以使用或者等來監(jiān)聽某個，當某個觸發(fā)后，可以使用等發(fā)起異步操作，操作完成后使用函數(shù)觸發(fā)，同步更新，從而完成整個的更新。對于何時響應和如何響應，并沒有控制權。的作用是用來取消一個還未返回的任務。項目地址項目截圖 showImg(https://segmentfault.com/img/bVUJwx?w=718&h=1294); redux-saga介紹眾所周知，react僅...

kel 2019-08-21 16:25 評論0 收藏0
25 歲，畢業(yè)寫前端的這三年

摘要：趕上時代的第一年我畢業(yè)后加入的第一家公司是科大訊飛。畢業(yè)的第一年里，我的工作以實現(xiàn)訊飛開放平臺的部分前端需求為主。以此為契機，我推動了團隊的前后端分離實踐，后來也有幸被評為了那一年的部門最佳新人。記得訊飛的內(nèi)部可以顯示每天的打卡排名。時間回到 2016 年，彼時 996 還不算福報，比特幣單價也還遠遠不到 1000 美元。那時的我懷著對大廠的敬畏和對前途的迷茫，拿著一紙畢業(yè)證告別了校園。這第...

zlyBear 2019-05-21 19:23 評論0 收藏0
你的 css 也需要模塊化

摘要：局部樣式通過，部分解決的模塊化的問題。全局樣式的特點，導致難以維護，所以需要一種局部樣式的解決方案。也就是徹底的模塊化，進來的模塊，需要隱藏自己的內(nèi)部作用域。 css 局部樣式 sass、less 通過 @import ，部分解決的 css 模塊化的問題。由于 css 是全局的，在被引入的文件和當前文件出現(xiàn)重名的情況下，前者樣式就會被后者覆蓋。在引入一些公用組件，或者多人協(xié)作開發(fā)同一...

Pikachu 2019-08-30 13:20 評論0 收藏0