前置知識：React/Redux/Restful API
關于為什么要使用GraphQL 前面已有幾篇文章鋪墊，這里主要總結用法。開始使用GraphQL之前，要安裝一些依賴：
apollo-boost 包含啟動阿波羅客戶端的所有依賴
react-apollo 視圖層面的集合
graphql-tag 解析查詢語句必須
graphql 也是解析查詢語句
強烈安利https://codesandbox.io運行實踐，可以減少電腦文件夾的凌亂感……下圖是安裝依賴的步驟：
安裝依賴
初始化完成后，頁面顯示正常。這時需要從依賴里引入幾樣東西：
引入ApolloClient并新建一個實例client；
引入ApolloProvider并且包裹頁面組件，ApolloProvider有一個屬性client用于連接GraphQL和React，它的用法類似Redux里的Provider。
引入gql用于解析GraphQL；
引入Query組件用于包裹頁面組件。
Query組件是這個項目里面最重要的組件之二，另外一個是Mutation。可以認為他們分別對應著Restful API 里面的GET和POST/PUT/DELETE等功能。
以下圖查詢狗類品種為例，在第12行gql語句部分聲明查詢狗的id和breed種類。然后第28行將該查詢語句作為Query組件的query屬性值，在第33行渲染部分，我們遍歷返回值，在頁面顯示所有的狗的品種名稱，得到右圖的結果。
查詢狗的品種
如果我們只想查詢某一品種的狗的圖片，可以通過variables屬性傳遞參數，在第16行查詢語句里新增查詢的字段名，第23行傳遞我們想查詢的實參mix，第28行添加形參breed品種，右圖也成功地查詢到了該品種的圖片。
傳參查看具體品種的圖片
Query部分的基本用法就是這樣，如果還有顯示加載狀態、錯誤處理、輪詢和重新獲取的需求，可以繼續參閱文檔。https://www.apollographql.com/docs/react/essentials/queries.html
相比Query部分，Mutation部分復雜一點，但是道理是相通的。這里以（萬年不變的）新增和編輯TODO為例，項目包括1個Query和2個Mutation，Query部分總是查詢當前的待辦事項，Mutation部分則是處理新增和編輯的操作。
新增編輯待辦事項例子
可以看到，兩處的gql語句的寫法，我們要拿到的值只有事項的id 和 事項內容的type 兩個。
兩條mutation語句
寫一個輸入框，點擊新增按鈕后，輸入框的內容便新增到了頁面，Mutation的屬性只有mutation和children是必須的。
其他的屬性也可圈可點，update有很多實用的方法，比如可以通過cache.readQuery 和 cache.writeQuery查詢和修改Query，就好像是和服務端通信一樣，update第二個參數是一個包含Mutation結果的對象。
optimisticResponse 可以讓頁面響應更快，你的調用會被執行兩次，一次是頁面的結果，另一次是真實的結果。比如一個評論功能，當你點擊提交按鈕的時候，頁面立即就更新了而無需等待服務端響應。
新增部分update第一個參數是cache
更新部分mutation嵌套在query里
