《Cloud Native Go》筆記（十二）使用React構建Web視圖

Cloud Native Go：構建基於Go和React的雲原生Web應用與微服務。Kevin Hoffman, Dan Nemeth著，TalkingData:宋凈超，吳迎松，徐蓓，馬超 譯，電子工業出版社，2017年。

筆記中有些內容直接引用原書。

=======================================================

Java之於JavaScript類似Car之於Carpet，根本毫不相干。——Chris Heilmann，Web佈道師

使用瀏覽器與應用程序交互，基本都會用到JavaScript，它是Web應用程序中不可忽略的一環。本章將介紹以下幾個方面：

1. 了解React的基本原理，以及選擇它的原因

2. 了解React的應用程序的結構

3. 構建一個基本的React應用程序

4. 介紹如何測試React應用程序

5. 更多關於學習React的建議

JavaScript的形勢

有無數的框架和庫可以用來解決前端、Web UI的問題。

構建單頁面應用，AngularJS很合適，也可以使用Backbone、Cappuccino、Ember、Meteor、Knockout、SproutCore、React等框架。

希望有很多優秀的組件庫來實現單純的GUI，那麼可以選擇AngularJS或者Bootstrap、CycleJS、ExtJS、jQuery UI等。

為什麼選擇React

React（https://facebook.github.io/react/）是一個用於構建用戶界面的JavaScript庫，它不是一個MVC系統，也不是一個包羅萬象的嘗試「將一些抽象化」的庫。SurviveJS（http://srivivejs.com/）上有很有參考價值的關於React和其它框架之間的比較結果，已經一套自學教程。

虛擬DOM

直接操作DOM（文檔對象模型）非常低效，而且頻繁更新時性能低下。虛擬DOM可以解決這些問題。React代碼操作虛擬DOM，可以將更新彙集起來後作用到真正的DOM，可以優化性能避免寫競爭。

虛擬DOM的概念是可移植的。可以是喲個React Native（https://facebook.github.io/react-native）工具，讓React代碼在Android和iOS等移動設備上運行。使用虛擬DOM時，更新作用於移動設備的GUI而不是瀏覽器DOM上。

組件組合：通過組件組合，React可以比其它的庫最大程度上縮小框架設計與實際實現之間的差距。

響應式數據流：React使用所謂的單向響應式數據流，這意味著我們構建的所有東西都是為了響應傳入的狀態變化。我們之所以喜愛React，是因為它在UI層面包含了事件溯源和CQRS。

React只集中於UI。UI提供一個框架，用於構建與虛擬DOM交互的組合式組件。我們認為是性能最好，最優雅和簡單的框架之一。當然比Go的世界差遠了。

構建簡單的React應用程序

建議大家從Github（https://github.com/cloudnativego/react-zombieoutbreak）或存儲庫的其他模版中複製完整的React應用程序示例代碼，而不是自己設置每個項目的架構。

推薦的React書籍：

Learning

React Native: Building Native Mobile Apps with JavaScript, Bonnie Eisenman著

Pro

React, Cassio de Sousa Antonio著

React: Up

and Running: Building Web Applications, Stoyan Stefanov著

其它資料：在Udemy（http://www.udemy.com）上有一個名為Build Web Apps with ReactJS and Flux的課程。

推薦閱讀：