react+redux構建一個假假假的記事本

前言

前端框架層出不窮,很多前端喊累,事實上個人覺得也還好。這句話在一個弱雞口中說出來顯然沒有意味。在眾多的原因之下我「放棄」了Vue,轉向React,很抱歉沒有成為尤大的粉絲。在學習React的過程中也由於我個人的局限性導致「我認為React比較簡單」,了解組件化思想、JSX寫法、props和state、組件生命周期等之後發現用React構建UI層很簡單,當然我知道自己這麼說不對,畢竟也不是那麼簡單,深入來看的話。

可能我們覺得React不難,但是加上Redux就有一點點了。框架的構造者希望產出物是簡潔的,而這個簡潔的產物背後的實現是複雜的。很多人包括我自己面對單向數據流思想的Redux時都會最初非常疑惑,然後似懂非懂,接著感覺茅塞頓開,最後逐漸踩坑解決問題。我想這個過程花費的時間很長可能是基礎知識不牢靠或者思想不到位的緣故吧。

當然很多人不會像我有這麼多關於難的體會,畢竟我很獨特,我是弱雞。弱雞也要啄米,所以接觸了Redux,其實「你可能並不需要Redux」這句話一直都影響著我的決定。但是你想啊,技術出來這麼久都成了業界標準的解決方案了,你好意思在一個產品實現過程中還在每個組件中設置state?有違風氣,也不符合當代前端的風氣。但其實對於個人來說學習標準的解決方案是有益的,都知道以後肯定會用到Redux,為什麼我還要不用它單純的寫個小應用然後再去重構呢?當然todo應用還是可以先寫寫的。

打開掘金,發現一溜煙的基於什麼什麼打造什麼什麼產品…其實我很看的有點煩也有點尷尬,以至於我已經很久沒有打開掘金了,而我也不覺得有什麼慚愧的。當時出來找實習的時候總是覺得自己在簡歷上沒有好的項目會找不到工作而露宿街頭,所以在知乎搜索框、百度搜索框中搜索「前端練手項目」,去百度IFE中找項目,然後精挑細選,還發現有很多是自己做不來的。現在卻隨手就能弄個項目了,尷尬的是我自己弄的項目還沒別人的高!大!尚!現在在一個不大不小的公司呆著了,就等著技術提升了,卻發現再次「迷茫」了,今天我在知乎搜索的內容是「前端中有哪些經典的輪子可以造」,很明顯我又要改方向了。尷尬,我一直的夢想可是打造一款令人驚呼的產品啊!

正文

接下來要說構建這個假假假的在線記事本的過程了。用了create-react-app來初始化項目,省時省事。npm安裝redux、react-redux、marked、moment等等開始開發,當然開發之前自己畫了個草圖並做了PC端和移動端的適配。用上Redux的項目都應該有個開發流程,寫這篇文章的時候我已經沒去搜具體的了,大概就是先寫actions,然後寫reducers,然後和components結合寫一些containers,然後組合起來,創建一個store來把數據跑通,期間可能會用到redux一些middleware實現非同步等操作(當然我這個記事本沒有),最後調整測試,部署上線。至此這個在線記事本已經完成了。

我他發!這就完了…

結語

通過這個小應用的構建過程我們能夠得到的信息就是,你想去做這種「仿」應用那就去做吧!期間你會發現很多知識需要查文檔、需要逛社區、需要問問題等等等,這些踩坑的過程就是你經歷的苦難蜜月,當你這些坑都踩過之後你去寫一篇文章也可以寫的如此暢快,而不用去羅列代碼湊字數,當然一些知識對於代碼塊的展示是必須的,可是這篇只是這種關於項目的文章嘛。還有一點要說的就是在寫這種項目之前還是需要一點了解,起碼官網文檔是要看一遍的,不看怎麼知道怎麼做呢...

但是項目雖然重要,也不要扎進去出不來吧,要麼去理解點更深層次的知識,要麼不斷去用新技術來實現項目,不要停留在用熟悉的知識做重複的事,酷炫的玩夠了也要靜下來去沉澱一些東西,不然一會應該會吃虧的。所以如果你看到這裡你會發現自己被標題黨了!這就是篇水文!沒有代碼!沒有乾貨!

當然 代碼地址 還是有的,質量應該不怎麼好,湊合著瞄~ximolang/yunbi-notes

在線預覽地址:芸筆

推薦閱讀:

前端的意義是什麼?
2016年,中國的前端在關注什麼?
font-family設置多個值以後,在瀏覽器中怎麼確定到底是哪個字體生效了呢?

TAG:React | Redux | 前端开发 |