內容簡介
《React 精髓》面向國中級前端開發者，從頭到尾、由淺入深地介紹了使用React 實現組件化Web 套用的完整流程。作者從React 元素、React 組件等基本的概念講起，循序漸進地討論了組件狀態和生命周期，為開發完整的React 套用打下了基礎。與第三方JavaScript 框架集成，以及對React 組件進行單元測試，都是開發React 套用的重要內容，《React 精髓》也有詳細講解。最後，為進一步提升React 套用的靈活性，作者還以實例展示了如何引入Flux 架構，讓讀者的開發技能更上一層樓。
編輯推薦
真正面向實戰的React圖書
揭秘Flux架構|徹底釋放React潛能
本書由國內前端勁旅奇舞團領銜翻譯
全面剖析組件化Web套用開發完整流程
內容提要
《React 精髓》面向國中級前端開發者，從頭到尾、由淺入深地介紹了使用React 實現組件化Web 套用的完整流程。作者從React 元素、React 組件等基本的概念講起，循序漸進地討論了組件狀態和生命周期，為開發完整的React 套用打下了基礎。與第三方JavaScript 框架集成，以及對React 組件進行單元測試，都是開發React 套用的重要內容，《React 精髓》也有詳細講解。最後，為進一步提升React 套用的靈活性，作者還以實例展示了如何引入Flux 架構，讓讀者的開發技能更上一層樓。
目錄
1 給項目預先安裝一些有用的工具 1
了解我們的項目. 2
安裝Node.js 和npm 3
安裝Git 4
從Twitter Streaming API 中獲取數據 5
使用Snapkite引擎來過濾數據 6
創建項目結構 9
創建package.json 10
復用Node.js 模組 11
使用Gulp.js 來構建套用 12
創建一個網頁 15
小結 16
2 創建你的第一個React 元素 17
理解虛擬DOM 18
安裝React 19
使用JavaScript 創建React 元素 20
type 參數 22
props 參數 22
children 參數 23
渲染React 元素 27
使用JSX 來創建React 元素 28
小結 30
3 創建你的第一個React 組件 31
無狀態與有狀態 31
創建第一個無狀態React 組件 32
創建第一個有狀態React 組件 37
小結 44
4 讓React 組件變得可回響 45
使用React 解決問題 45
規劃React 應用程式 47
創建一個React 組件容器 49
小結 57
5 結合其他庫來使用React 組件 59
在React 組件中使用其他庫 59
理解React 組件的生命周期方法 64
掛載方法 66
卸載方法 71
小結 72
6 更新React 組件 73
理解組件生命周期的更新方法 73
componentWillReceiveProps()方法 74
shouldComponentUpdate()方法 77
componentWillUpdate()方法 77
componentDidUpdate()方法 78
設定React 組件的默認屬性 79
驗證React 組件的屬性 83
創建Collection 組件 85
小結 91
7 構建複雜的React 組件 93
創建TweetList組件 93
創建CollectionControls組件 98
創建CollectionRenameForm組件 105
創建Button 組件 111
創建CollectionExportForm組件 112
小結 114
8 使用Jest 來測試React 應用程式 115
為什麼要寫單元測試 115
創建測試套件、規範和期望 115
安裝並運行Jest 121
創建更多的測試規範和期望 122
測試React 組件 130
小結 137
9 使用Flux 完善React 架構 139
分析當前套用的架構 139
理解Flux 142
創建分發器 143
創建動作生成器 144
創建存儲 145
小結 150
10 使用Flux 提升套用的可維護性 151
藉助Flux 實現解耦 152
重構Stream 組件 155
創建CollectionStore 161
創建CollectionActionCreators 167
重構Application 組件 169
重構Collection 組件 171
重構CollectionControls組件 175
重構CollectionRenameForm組件 178
重構TweetList組件 180
重構StreamTweet組件 181
編譯 181
精彩節摘
推薦序
你是否厭倦了寫jQuery 的“回調湯”？是否在需要寫新模板或者配置Angular 套用時感到抓狂？是否很想知道為什麼自己的套用結構如此複雜？如果是這樣，那么React.js 正是能滿足你需要的框架。React.js 的聲明式語法將幫你為大型套用構建數據隨時間變化的用戶界面。
作為一個專業的iOS 和JavaScript 前端顧問，我總是建議客戶使用當下最先進的技術。隨著Facebook 的不斷推陳出新，React.js 已被證明是一個可靠的選擇，它能幫我們創建可維護和高性能的用戶界面，進而幫助我們的客戶更快地交付產品，實現更迅速的發展。我很高興知道這本書即將出版，更讓我興奮的是自己居然提前看到了它。
ArtemijFedosejev是一位資深的Web 開發者，在倫敦一家創業公司做技術負責人，他在這本書里展示了為什麼聲明式的編程風格和單向反應式數據流動常常是解決現實編程問題的最佳途徑。無論開發消費者套用還是學術性網站，無論規模大小，React.js 都可以幫你搭建其前端UI。而且你永遠不會再迷失在代碼中了。這本書是Artemij基於自己的實際經驗編寫的，讀完本書你就可以創建自己的用戶界面，而且不會增加套用的複雜性。
這本書涵蓋了從零開始學習React.js 所需的一切。它會從最基礎的安裝環境逐步引導你，直到複雜的Jest 測試框架。最好的學習方法是做中學，所以本書將帶你開發一個實際的React.js 項目，創建一個能夠對Twitter 上的最新照片實現接收和分類的應用程式。
軟體行業不斷發展變化。作為開發者，我們總能通過實踐把觸角伸向新領域，拓寬視野，刷新我們對如何構建優秀軟體的認知。從發展歷史來看，軟體開發和架構已經從結構化發展到命令式。面向對象編程由此成為軟體開發的事實標準。Java、Ruby、Objective-C等語言都原生支持OOP。
然而，這時候出現了一個支持函式式編程的異類，走出了一條獨特的進化之路，它就是JavaScript。React.js 就是“把UI 當作狀態的函式”這種新思維的產物。Facebook 為了讓開發者熟悉這種反應式的思維已經付出了很多努力。與使用模板系統的Ember.js、Angular.js 等流行框架不同，React.js 是一個使用聲明式編程風格來描述UI 狀態的UI 庫。可以把React.js 看成是傳統MVC 模式中的V，但它並不限於此。Facebook 又引入了一個互補性的Flux 套用架構，它使用React 的可組合視圖組件。
解決編程問題的最新方法又回到了聲明式編程的起點。新範式的興起，比如ReactiveExtensions（Rx）、Futures 和Promise 讓我們開始重新思考函式式編程，以及使用聲明式方法代替OOP 的命令式風格。React.js 體現了這樣一些範式，而這本書正是你掌握它的第一步，相信你會喜歡它。
Alex Bush
SmartCloud公司創始人兼軟體產品工程師
作者簡介
ArtemijFedosejev是一位技術大牛，現居住在英國倫敦。他從2000 年開始自學Web開發，並成為了一位Web 開發者。Artemij在愛爾蘭的科克大學獲得了計算機科學學士學位。他還參加了Ignite 的商業研究生創新計畫，在那裡開發和創建的網站獲得了最具創新項目獎。
畢業後，Artemij移居倫敦，幫助當地創業公司開發產品。Artemij擅長 JavaScript、Node.js、HTML5、CSS3 等現代Web 技術。在創業公司獲得一些經驗以後，Artemij獲得了一個加入倫敦皇家學院的機會，從事研究和開發工作，在公共衛士領域規劃和主導了一些Web 應用程式。他在創WGSA.net 和Microreact.org 的前端架構中使用了React.js 和Flux，從而起到了關鍵的作用。Artemij還開發了大量的開源項目，如Snapkite引擎、Snapkite流客戶端等項目，可以在他的 GitHub 上找到相關內容。
我深深地感謝我的家人，在我努力的過程中他們一直支持我。有了他們的愛和奉獻，我才能一直把重點放在學習新鮮事物上，然後傳授給別人。特別感謝AlexBush不斷擴展我對軟體開發方式的認識。同時，這本書的編寫少不了DavidAanensen博士和MirkoMenegazzo的支持。最後，我要感謝我的編輯和給我這個機會的Packt出版社的好心人，讓我可以給世界各地的開發者分享我的知識和經驗。
媒體推薦
你是否厭倦了寫jQuery 的“回調湯”？是否在需要寫新模板或者配置Angular 套用時感到抓狂？是否很想知道為什麼自己的套用結構如此複雜？如果是這樣，那么React.js 正是能滿足你需要的框架。React.js 的聲明式語法將幫你為大型套用構建數據隨時間變化的用戶界面。
作為一個專業的iOS 和JavaScript 前端顧問，我總是建議客戶使用當下最先進的技術。隨著Facebook 的不斷推陳出新，React.js 已被證明是一個可靠的選擇，它能幫我們創建可維護和高性能的用戶界面，進而幫助我們的客戶更快地交付產品，實現更迅速的發展。我很高興知道這本書即將出版，更讓我興奮的是自己居然提前看到了它。
Artemij Fedosejev 是一位資深的Web 開發者，在倫敦一家創業公司做技術負責人，他在這本書里展示了為什麼聲明式的編程風格和單向反應式數據流動常常是解決現實編程問題的最佳途徑。無論開發消費者套用還是學術性網站，無論規模大小，React.js 都可以幫你搭建其前端UI。而且你永遠不會再迷失在代碼中了。這本書是Artemij 基於自己的實際經驗編寫的，讀完本書你就可以創建自己的用戶界面，而且不會增加套用的複雜性。
這本書涵蓋了從零開始學習React.js 所需的一切。它會從最基礎的安裝環境逐步引導你，直到複雜的Jest 測試框架。最好的學習方法是做中學，所以本書將帶你開發一個實際的React.js 項目，創建一個能夠對Twitter 上的最新照片實現接收和分類的應用程式。
軟體行業不斷發展變化。作為開發者，我們總能通過實踐把觸角伸向新領域，拓寬視野，刷新我們對如何構建優秀軟體的認知。從發展歷史來看，軟體開發和架構已經從結構化發展到命令式。面向對象編程由此成為軟體開發的事實標準。Java、Ruby、Objective-C等語言都原生支持OOP。
然而，這時候出現了一個支持函式式編程的異類，走出了一條獨特的進化之路，它就是JavaScript。React.js 就是“把UI 當作狀態的函式”這種新思維的產物。Facebook 為了讓開發者熟悉這種反應式的思維已經付出了很多努力。與使用模板系統的Ember.js、Angular.js 等流行框架不同，React.js 是一個使用聲明式編程風格來描述UI 狀態的UI 庫。可以把React.js 看成是傳統MVC 模式中的V，但它並不限於此。Facebook 又引入了一個互補性的Flux 套用架構，它使用React 的可組合視圖組件。
解決編程問題的最新方法又回到了聲明式編程的起點。新範式的興起，比如ReactiveExtensions（Rx）、Futures 和Promise 讓我們開始重新思考函式式編程，以及使用聲明式方法代替OOP 的命令式風格。React.js 體現了這樣一些範式，而這本書正是你掌握它的第一步，相信你會喜歡它。
——Alex Bush，SmartCloud 公司創始人兼軟體產品工程師
前言
如今，Web 已經變得不同。我們構建網頁的方式也已經不同。面對不可維護的jQuery代碼，我們不得不尋找新的方法來管理複雜的現代用戶界面。我們需要一個新的用戶界面庫，它可以幫助我們使用JavaScript 來創建聲明式、模組化、更快速、可伸縮的前端應用程式。
React.js 是Facebook 開發的一個用戶界面庫，在如何與DOM 互動、如何組織數據流和將用戶界面元素看作組件方面，為我們帶來了全新的思潮。而且，它只是一個用戶界面庫，對技術棧的其餘部分並沒有要求。
React.js 與Flux 結合起來，就為我們提供了一個強大的前端架構。這無論是對經驗豐富的開發人員，還是對那些剛剛接觸前端的人來說都很有意義。無論開發經驗多寡，面臨問題難易，團隊規模大小……前端的同學們，歡迎邁進一個新時代！
準備好體驗React.js 將要帶給你的簡單、周到、可預測的驚喜吧。
本書內容
第1 章會介紹本書目標，並講解為了有效構建 React 套用需要哪些現代化工具。本章將帶你逐步安裝這些工具，還會創建本書示例項目的結構。
第2 章會講解如何安裝React 並介紹虛擬DOM。然後講解使用原生JavaScript 語法如何創建和渲染React 元素。最後介紹JSX 語法和如何使用JSX 來創建React 元素。
第3 章會介紹React 組件，講解有狀態和無狀態兩種不同的React 組件，以及如何決定使用哪一種。然後會引導讀者掌握如何創建它們。
第4 章會講解如何使用React 解決問題，並帶你實際規劃一個React 應用程式。我們將創建一個React 組件，用於封裝本書將構建的React 應用程式。還會講解父組件與子組件的關係。
第5 章探討在React 組件中如何使用第三方JavaScript 庫。介紹React 組件的生命周期，演示如何使用裝載方法，並為本書的項目創建新React 組件。
第6 章介紹React 組件的更新方法，其中涵蓋了如何在JavaScript 中使用CSS 樣式。還講解了如何驗證和設定組件屬性的默認值。
第7 章將焦點放在構建更複雜的React 組件上，探討如何實現不同的React 組件，以及如何將它們放在一起，並完成最終的React 應用程式。
第8 章講解單元測試的思想和如何使用Jest 來編寫並執行單元測試，也會演示如何測試React 組件，並討論測試套件、規格、期望和匹配器。
第9 章討論如何改進React 應用程式的架構，介紹Flux 並講解分派器、存儲與動作發生器等角色。
第10 章講解如何使用Flux 在 React 應用程式中處理解耦問題，並重構我們的React應用程式以減少維護成本。
讀者對象
本書適合那些想要構建可擴展、可維護Web 用戶界面的前端工程師。你只需要具備一些JavaScript、HTML 和CSS 的核心知識，就可以感受到React.js 為Web 開發帶來的革命性的好處。如果你具備jQuery 或者Angular.js 的開發經驗，那么你就更容易理解React.js相較於其他庫的優勢，以及如何利用這些優勢。
勘誤表
雖然我們已經盡力謹慎地確保內容的準確性，但錯誤仍然存在。如果你發現了書中的錯誤，包括正文和代碼中的錯誤，請告訴我們，我們會非常感激。這樣，你不僅幫助了其他讀者，也幫助我們改進後續的出版。如發現任何勘誤，可以在博文視點網站相應圖書的頁面提交勘誤信息。一旦你找到的錯誤被證實，你提交的信息就會被接受，我們的網站也會發布這些勘誤信息。你可以隨時瀏覽圖書頁面，查看已發布的勘誤信息。
