ParseReact觀念架構

ParseReact是一個可以利用Parse API來跟React.js溝通的library

建立在Parse JS SDK上層，透過web kit來讀取在雲端parse的資料。
簡單來說啦，就是前端用React，後端用Parse而已啦，基本上是用React寫，用ParseReact提供的一些特定function可以去query Parse上的資料。

為什麼會使用這個呢？其實我使用Parse已經有一段時間了，Parse就是一個免費的雲端資料庫，透過撰寫Cloud Code來讀取存在雲端的資料。由於Parse是在FB底下的一項服務，在網路上也是蠻紅的，功能也很多，像是處理geopoint、或是對query做處理，也有關於promise同步非同步的觀念架構，算是蠻強大的雲端資料庫。

而React是最近最火紅的view library，像今年的jsdc，大概有一半的講者都提到的了React!!!!

可見他現在在javascript佔有一席之地。

同時，他也是fb底下的服務，現在就來稍稍介紹一下React。

React的核心就是利用個別的component來維護state和UI，再重新render component

概念分為四部份

ㄧ、component

二、JSX

三、Virtual DOM

四、Data Flow

ㄧ、component

能將頁面配置為各component，例如：

在這張圖片中可以看見，一個網頁分成許多不同區塊，這樣的好處是，當你明確知道哪裡需要更改，直接去那個component改好之後就可以render新的部分就好，而不需要全部都重新載入，可以減少時間和server負擔。

二、JSX

JSX就是將html嵌入javascript的一種語言，優點就是html是顯示的內容，javascript是邏輯處理，我們常常為了理解html中的一個view是怎麼得到的而在javascript內找半天，若適合在一起，網頁的view和邏輯能一起，開發的過程中會省去很多心力。

三、Virtual DOM

Virtual DOM用來記錄component state的改變，通過特殊的diff算法找到DOM節點，再做修改。

優點是不需找整個DOM，花時間也對server造成很大的負擔，當程式開發越來越大的時候，需要負荷的就會越多。性能相較起來較好。

四、Data Flow

單向數據流，和Flux結合。React 負責的是MVC中的view，而Flux就相當於添加了MVC中的model、controller。

1.view去觸發action

2.action傳給dispatcher去做分發

3.store再觸發change事件通知view"data改了喔"

4.利用change事件，調用setstate更新UI

這個時候我就想問

那原來的mvc和flux有啥不同？

原來的mvc不限制數據只能單向流，於是view跟model間的關係就會變得非常複雜，當專案邊大的時候，會很難維護。

且單向資料比較容易了解，就算發展成大型結構的城市也較易維護，雙向資料流的綁定會贈呈連鎖更新，比較不易找出單一action所造成的改變結果。

好啦接下來觀念建構好了之後，我們下一篇再來實作吧