自序
致讀者
本書是為想以React、Redux、Babel和Webpack來架設Web 應用程式的程式設計師所準備的。與其他技術堆疊相比,此技術堆疊(指的是React、Redux、Babel、Webpack以及社區中許多與此相關的優秀工具)的學習成本並不低,但其中的智慧與思想卻著實令人讚歎:清爽的元件程式結束了全螢幕HTML標籤與類別名稱的噩夢;宣告式地將資料對映為介面,減少了煩瑣的DOM操作;高階函數、管線、Currying等函數式程式設計思想的運用,使得複雜邏輯的處理變得相當簡單;自動化建置編譯技術降低了原始程式碼與靜態資源的管理成本。隨著時間的演進,技術工具或許很快會改朝換代,但是這些前端工程中的最佳做法思想卻不會輕易過時。如果你不僅想學習這些技術的使用方法,更想了解這些技術背後所包含的思想與智慧,那麼筆者真誠地建議你閱讀本書。
✤閱讀本書之前的準備
想要極佳地了解本書的內容,讀者需要具備一定的Nodejs和ES2015、ES2016基礎,至少要了解一些常見的概念,例如NPM、模組系統、常數、函數、裝飾器和類別。除此之外,最好還熟悉JavaScript程式在伺服器和瀏覽器環境下的除錯技術。
學習本書範例程式時,大部分時間都要在命令列中操作。因此,你應該能夠熟練使用自己作業系統中的命令列工具。
本書附帶的程式是開放原始碼的,全部上傳到GitHub。這些範例程式中的開發經驗來自開放原始碼社區和筆者自己的實作思考。筆者並不認為這是使用React與Redux開發Web應用程式的唯一方式。讀者可以將其作為參考,如果有更好的想法,強烈建議讀者將其貢獻給社區,與更多的開發者一起交流進步。
最後要說明的是,本書因篇幅有限等原因,無法對每一項技術的說明都做到完整而詳盡。因此,讀者可根據書中的提示和推薦,去閱讀參考對應技術的官方文件。
✤本書的內容安排
本書分為四部分。
第一部分 基礎篇 主要介紹React與Redux的基礎知識。第1章 簡介本書所要說明的技術,包含React、Redux、Node與Universal繪製、Babel及Webpack。
第2章 說明如何在Nodejs中執行React。
第3章 說明如何在瀏覽器中執行React。
第4章 介紹開發伺服器和熱更新 (hot reloading) 技術及其實現過程。
第5章 介紹React的創新語法:JSX。
第6章 介紹React的資料載體:state、props與context。
第7章 介紹React的兩個物件:ReactElement和元件實例。
第8章 介紹Redux的action、reducer與store。
第9章 介紹Redux的action建立函數和Thunk中介軟體。
第二部分 進階篇 透過精彩的官方範例學習React與Redux。
第10章 說明如何手動將Redux連接到React中。
第11章 說明如何使用react-redux將Redux連接到React中。
第12章 介紹Redux的復原 (Undo)/重做 (Redo) 和Redux開發者工具的使用。
第13章 說明如何在React與Redux的程式中撰寫測試。
第14章 討論Redux的全域狀態與React元件的內部狀態。
第15章 說明React與Redux中常用的幾種陣列處理方法。
第16章 介紹Redux中的非同步處理。
第17章 介紹如何自訂Redux中介軟體。
第18章 說明如何使用React與Redux實現Universal繪製。
第三部分 擴充篇 學習一些優秀的協力廠商擴充。
第19章 介紹Webpack同構工具。
第20章 介紹React Router,並透過它實現Universal路由。
第21章 介紹多頁面下的非同步處理。
第22章 介紹了bootstrap-loader、PostCSS、Autoprefixer和React-Bootstrap。
第四部分 實戰篇 逐步架設大型Web 應用程式。
第23章 介紹一個大型專案的基本結構。
第24章 使用ReduxForm製作各種表單。
第25章 實現圖表與表格。
第26章 實現使用者認證。
第27章 說明部署到Heroku的方法,並實現持續整合。
第28章 列出其他資源。
✤如何使用範例程式
本書使用的範例程式可在GitHub上取得:
https://githubcom/lewis617/react-redux-book https://githubcom/lewis617/react-redux-heroku 除了第1章和第28章外,本書每個章節都有一個範例程式。前三部分使用了短而精的範例程式,獨立示範技術的功能。從第四部分開始,每一章的實例都會建立在前一章實例的基礎上,最後完成一個大型專案的架設。
另外,為了方便部署到Heroku,並實現持續整合,第27章的實例被獨立到另一個GitHub倉庫中,也就是上述的第二個GitHub倉庫。
✤致謝
在寫這本書的過程中,家人、朋友、主管、同事都給我了很多幫助。沒有他們,我是不可能完成本書的,在此表示由衷的感謝。
首先我要特別感謝王祖超、梁錦津、宋兵、陳仕傑、屈光宇、呂明岩,他們在本書撰寫的不同階段審校書稿,並對書稿涵蓋的內容和架構給予了建設性建議。
還要感謝電子工業出版社的許豔編輯,她對本書進行了出色平穩的編輯,並給予我無盡的支援、建議和協助。
最後,感謝在GitHub社區中為本書提供幫助的人士:
■ Dan Abramov(Redux的作者)
■ Nikolay Nikolaev(Webpack同構工具的作者)
■ Erik Rasmussen(ReduxForm的作者)
■ Eric Ferraiuolo(serialize-javascript的貢獻者)
■ Mihail Diordiev(redux-devtools-extension的作者)
他們積極熱心地回覆我傳送的Issue,為本書提供了重要的技術支援。