前端首選:React+Redux 開發最漂亮的介面

劉一奇

立即出貨 (庫存 < 9)

買這商品的人也買了...

相關主題

商品描述

本書特色
√React與Redux的基礎知識介紹。
√透過精彩的官方範例學習React與Redux。
√優秀協力廠商的相關擴充學習。
√架設大型Web應用程式實戰。
全書不僅止於介紹技術的使用方法,更詳析其背後的理念與智慧。除此之外,全書除了第1章和第28章外,每章節都有範例程式。
本書特別推薦給欲使用React、Redux、Babel與Webpack來架設Web應用程式的程式設計師,此技術堆疊的特點如下:
√清爽的元件程式結束了全螢幕HTML標籤與類別名稱的噩夢。
√宣告式地將資料對映為介面,減少了煩瑣的DOM操作。
√高階函數、管線、Currying等函數式程式設計思想的運用,使得複雜邏輯的處理變得相當簡單。
√自動化建置編譯技術,降低了原始程式碼與靜態資源的管理成本。
適用:熟悉JavaScript程式設計,有興趣使用React與Redux來架設Web應用的程式設計師與相關從業人員
 

目錄大綱

第一部份 基礎篇
Chapter 01 技術簡介
React
Redux
Node與Universal繪製
Babel
Webpack
歸納
Chapter 02 在Nodejs中執行React
實例
撰寫React元件
在Nodejs中繪製元件
使用Babel編譯執行Nodejs程式
    Require Hook簡介
    使用Require Hook的步驟
歸納
Chapter 03 在瀏覽器中執行React
實例
元件重複使用
在瀏覽器中繪製React元件
使用Webpack 包裝編譯
在瀏覽器中執行
歸納
Chapter 04 開發伺服器和熱更新 (hot reloading)
實例
安裝
設定Babel
    使用react-hmre預設
    react-hmre的功能
設定Webpack
設定Express伺服器
歸納
Chapter 05 React 的創新語法:JSX
實例
JSX簡介
JSX常用語法
    類似HTML
    JavaScript運算式
    樣式
    註釋
    陣列
    HTML標籤vs React元件
歸納
Chapter 06 React的資料載體:state、props與context
實例
State
Props
    使用props
    驗證props
    組合使用state與props
Context
    使用props傳遞資料
    使用context傳遞資料
    Props與context的適用場景
在React開發者工具中檢視
歸納
Chapter 07 React的兩個物件:ReactElement與元件實例
實例
ReactElement
    JSX中的閉合標籤是ReactElement
    ReactElement是什麼
    ReactElement的兩種類型
    React元件的繪製流程
元件實例
    元件實例簡介
    元件、ReactElement與元件實例的區別
    元件實例的生滅:生命週期函數
    React元件中的this
歸納
Chapter 08 初識Redux
實例
Action
Reducer
    定義
    純函數
    不能修改參數state
Store
    職能
    建立
    取得與監聽
    發起action
歸納
Chapter 09 Action建立函數與Redux Thunk中介軟體
實例
Action建立函數
    撰寫
    發起
    意義
Redux Thunk中介軟體
    功能
    安裝啟動
歸納
第二部份 進階篇
Chapter 10 React與Redux的連接:手動連接
實例
手動連接的步驟
    撰寫React元件
    撰寫Redux
    將Redux手動連接到React元件
手動連接的缺點
歸納
Chapter 11 React 與Redux的連接:使用react-redux連接
實例
連接步驟
多種寫法
連接原理
    Provider工作原理
    connect工作原理
展示元件與容器元件
歸納
Chapter 12 實現復原(Undo)/ 重做(Redo)
實例
復原(Undo)/ 重做(Redo)
Redux開發者工具
    安裝
    使用
Redux並不「低效」
歸納
Chapter 13 測試
實例
測試工具
    Mocha
    Enzyme
    Expect
測試action建立函數
測試React元件
測試容器元件
測試reducer純函數
執行測試指令稿
歸納
Chapter 14 Redux的全域狀態與React元件的內部狀態
實例
全域狀態與內部狀態的定義
全域狀態完全替代了內部狀態?
全域狀態與內部狀態的適用場景
歸納
Chapter 15 React與Redux中的陣列處理
實例
reduce()
    概述
    語法
    範例
filter()
    概述
    語法
    範例
map()
    概述
    語法
    範例
every()
    概述
    語法
    範例
some()
    概述
    語法
    範例
展開運算子
    概述
    語法
    範例
歸納
Chapter 16 Redux的大舞台:非同步
實例
JavaScript事件驅動程式設計
Promise
Redux中的非同步
    非同步action建立函數
    非同步請求前後的state變化
State tree結構
    檢視state tree
    如何建置state tree
非同步與變化
    準備工作
    追蹤非同步與變化
歸納
Chapter 17 自訂Redux中介軟體
實例
中介軟體的功能
中介軟體的撰寫
中介軟體的執行
自訂API 中介軟體
歸納
Chapter 18 Universal繪製
實例
公用一套程式
服務端繪製
用戶端繪製
歸納
第三部份 擴充篇
Chapter 19 Universal繪製神器:Webpack同構工具
實例
Webpack同構工具的功能
服務端呼叫
用戶端呼叫
真實場景
    設定伺服器的入口
    獨立開發伺服器
    設定Webpack
    設定Webpack同構工具
    在服務端和用戶端使用require()
歸納
Chapter 20 多頁面的實現:路由
實例
路由也是元件
路由比對
使用Link 和IndexLink 導覽
服務端路由
歸納
Chapter 21 多頁面下的非同步作業
實例
redux-amrc
    功能
    設定
    使用
    Action與state
    API
多頁面下的非同步作業
    撰寫測試API
    預載資料
    手動載入資料
    操作資料
歸納
Chapter 22 使用Bootstrap
實例
bootstrap-loader
    基本用法
    設定
PostCSS與Autoprefixer
    簡介
    用法
React-Bootstrap
歸納
第四部份 實戰篇
Chapter 23 架設大型專案
實例
開發伺服器
    開發環境下的Webpack設定
    Webpack同構工具的設定
    獨立的開發伺服器
    啟動開發伺服器
前端伺服器
    設定前端伺服器
    使用元件繪製HTML頁面
    啟動前端伺服器
API伺服器
    設定API伺服器
    啟動API伺服器
生產環境下的建置編譯
    編譯執行Nodejs
    生產環境下的Webpack設定
公用程式
    工具集
    路由與頁面
品質保障
    測試
    Airbnb程式開發標準
    除錯機
    EditorConfig
歸納
Chapter 24 表單
實例
高階元件ReduxForm
設定
簡單表單
同步驗證表單
非同步失焦驗證表單
傳送表單到伺服器
歸納
Chapter 25 圖表與表格
實例
圖表元件
表格元件
從伺服器取得資料
歸納
Chapter 26 使用者認證
實例
撰寫認證API
    Express-session中介軟體
    載入目前認證狀態
    登入與登出
    API許可權保護
發送cookie
撰寫用於認證的action建立函數
登入頁面和導覽列
前端路由保護
歸納
Chapter 27 部署
實例
Heroku平台
    安裝工具並登入
    準備程式
    部署程式
    其他操作
持續整合
與生產相關的問題
歸納
Chapter 28 其他資源
線上文件
參與社區活動