redux 並不是只和 react 結合使用的，它也可以和其他的很多類庫結合起來一起使用，即使你還未開始深入使用，你也可以閱讀文中的部分內容。
在深入 redux 、testing 或是其他更高階的使用之前，我們還是先開始 react 吧。
sudo npm install create-react
-gcreate-react
cd react-demo
&& npm install
npm start
使用 setstate 來改變元件的狀態 state
元件生命週期相關的方法
事件和表單
幾種建立元件的方式
復合元件 composeable
高階元件的使用和定義 hoc
在你遇到應用的狀態管理問題之前，你可以通過擴充套件應用的方式來解決，或是你在你的應用中壓根就沒遇到過這樣的問題，因為你可以使用 setstate 來很好的管理你的應用。但其實 setstate 也不是那麼高效，畢竟它也不是萬能的。也許你會發現你已經在忙於處理太多的元件內部狀態，那麼，該是時候引入類似 redux 等狀態管理庫了，不過有幾個事情需要注意：
在學習 redux 前得先學好 react
可以閱讀以下you might not need redux
不是所有的狀態都需要放在 redux 的 store 中，也不能完全取代 setstate
一般地，會有三種不同的方式來宣告乙個元件：
react.createclass 使用這個api來定義元件
react es6 class components 使用 es6 的class 來定義元件
functional stateless components 通過函式直接定義無狀態元件
// react.createclass
var todoitem = react.createclass()
// react es6 class
class todoitem extends react.component
// functional stateless component
function todoitem()
那什麼時候該用什麼方式來定義呢
無狀態元件：適合用來宣告沒有元件生命週期方法並且沒有內部狀態的元件。這種寫法很簡單，就是乙個純函式，乙個狀態輸入，輸出就是elements。
(state) => view
這是一種最輕便最高效的元件宣告方式，這種元件沒有任何的內部狀態，使用的時候也無法訪問到元件的屬性，所以一般建議能用這種方式宣告元件的時候就盡量採用這種方式。
如果你需要使用元件生命週期方法，並且需要去處理元件內部狀態（this.state） ，或者需要獲取這個元件（this.ref）。那麼，這個時候建議你使用es6的 class 來宣告元件。
另外，建議還是別用react.createclass這種方式宣告元件了，facebook 官方在react v0.13版本的時候就說過，以後的目標是使用es6 classes的方式來定義，會完全廢棄react.createclass
should-i-use-react-createclass-es6-classes-or-stateless-functional-components（
react-create-class-versus-component（
輕量級的函式式無狀態元件
專案中一定需要去宣告很多元件，我們可以一起來完成乙個 todolist 元件：
function todolist()
)} );
}我們還可以按函式的方式將其拆分
function todolist()
); }function todoitem() ; }
這個例子有些簡單，無法很直接的看到這種定義方式的好處，但是當我們將元件拆分後將更具有可讀性、可復用性以及可維護性。這種方式很靈活，而且很輕鬆就可以宣告多個元件，一口氣不費勁，推薦使用。
簡潔的函式式無狀態元件
我們可以使用 es6 的 arrow functions 讓元件的定義更加的清新。假如我們有乙個這樣的元件：
function button()
); }
我們可以將其用 es6 的語法改寫公升級一下：
const button = () =>
); }
還可以再簡單嗎，我們來試一試：
const button = () =>
但這種方式就只允許我們的元件只有 props 作為輸入，elements 作為輸出。但如果我們希望在這中間做一些業務邏輯呢，我們可以將其再修改一下：
const button = () =>
); }
木偶元件presenter component和容器元件container component
好吧，這兩個詞聽起來實在是彆扭，聽我慢慢道來。
react 中的元件其實也只是應用狀態的一種表現方式，這讓我們可以非常清晰的通過 (state) => view 這樣的方式來理解。並且，元件內由處理程式來改變 state，從而改變不同 view 的展示。
那麼，木偶元件和容器元件有什麼區別或是怎麼理解呢。
當專案中使用了redux的時候，container component 有個更好理解的名字，就是connected component。這類元件和redux的store進行了連線，並且獲取到store的資料之後進行一些操作後傳遞給子元件。
container components容器元件關注事情是怎麼做的，presenter components木偶元件關注怎麼展現，各司其職，其樂融融。
什麼時候該用 container components 容器元件呢
前面聊完，我想你應該知道兩者的區別和使用場景了，但也許你還不太確定什麼時候該用什麼型別的元件。你可以定義乙個container components，然後把一些presenter components都作為他的子元件，這樣父元件關注如何工作，子元件關注如何展現。
但慢慢的，你發現父元件需要給子元件傳遞的properties和callbacks越來越多了，咋辦呢，現在是時候來介紹兩者如何結合使用了。
一般地，有個很好的原則：堅持presenter components不變，只新增一系列的container components去適應業務邏輯的改變。
把container component放到什麼地方呢
父元件container component只關注state如何處理，現在你可以評估一下你的preenter component下面的子元件了。也許你會注意到preenter component下面的子元件沒有被其他元件使用，那麼找到這個元件的父元件，給它新增乙個用於管理狀態的container component，這樣，父級的container component就能夠變得更加清晰輕量，因為它沒有必要去處理這些所有的狀態。
很多presenters component也許只是包含一些只是為他們自己使用的props和callbacks，那麼，也給他們加上乙個container component去處理這些邏輯，把這些邏輯放到container component，這樣將使父級的container component 再次變得輕量。
寫出你的第乙個高階元件hoc吧
想象一下你需要展示一列內容，但是你不得不首先通過非同步的方式獲取這些內容項。現在你需要乙個載入指示器來顯示目前正在傳送請求中，等請求完成後，你再展示獲取到的內容項。
不過你可以更進一步來學習hoc了，乙個高階元件hoc將會返回乙個增強的函式。
// 定義乙個高階元件
function withloadingspinner(component) ) {
if (!isloading) {
return
分配時間的一些建議
一 儘量減少做無用功。勿衝動，再好的想法也不要衝動，做完了才發現白做了就晚了。勿求全，不要把目標定的太高，就像裝修房子，每個人都恨不得精益求精，最後花費巨大的錢財和時間，很多事情夠用就好。另外要學會放棄，人生可以做的事情很多，不必貪多，猴子掰玉公尺，最後一無所獲。這樣也許可以節約你80 的時間，還省...
IT職場生存的一些建議
對大部分人來說，工作都是生活不可缺少的部分 一方面工作的收入可以解決我們生存的問題，另一方面我們在工作中可以實現自我價值。人的一生最美好的時光大都花費在工作上或與工作有關的事情上，因此把工作做得漂亮一點，收入高一點，職位公升的快一點，從而使你在工作中有一種愉悅的心情是很重要的，這大概也是人這一輩子快...
關於答辯的一些建議
本文出自 4月只寫了兩篇部落格，主要原因在於畢業設計，然後做了很多想做的事。五月就從這篇部落格開始 我們那個教室很嚴，掛了很多人，作者也就勉強通過。先說說哪類人容易掛 1.堅持 是自己寫的然後乙個技術問題也答不上來 2.答辯語無倫次，答非所問，也就是表達問題 3.在 導師質疑批評你是時，跟導師搞起來...