rukeith / gitbook-react

This is a note about React.js

React-Note

This is a note about React.js v0.14 and the Chapter 01 to Chapter 06 is a translate from React.js offical website.

• Chapter 1：Getting Started
  • 一個有狀態的元件
  • 一個應用程式
  • 一個使用外部插件的元件
• Chapter 2：Quick Start
  • Getting Started
    • JSFiddle
    • 從 npm 開始使用 React
    • 不藉由 npm 快速開始
      • 分離檔案
      • 離線轉換
  • Tutorial
    • 想要跳過後續所有的內容，只看原始碼？
    • 運行伺服器
    • Getting started
    • 你的第一個元件
      • JSX 格式
      • 發生了什麼事
    • 建構元件
      • 使用屬性(props)
      • 元件屬性
      • 添加 Markdown 的格式
      • 接入數據模型
      • 從伺服器獲取資料
      • 響應狀態變化(Reactive state)
        • 更新 state
      • 新增評論
  • Thinking in React
    • 從原型(mock)開始
    • 第一步：拆分 UI 到元件階層
    • 第二步：利用 React，創建應用的一個靜態版本
      • 穿插一小段內容： props 與state 比較
    • 第三步：找出最小（但是完整的）代表的 UI state
    • 第四步：找出 state 的生命週期
    • 第五步：添加反向數據流
• Chapter 3：Guides
  • Why React ?
    • 簡單
    • 聲明式(Declarative)
    • 構建可組合的元件
    • 給它5分鐘的時間
    • 了解更多
  • 呈現資料
    • Getting Started
    • 響應式更新(Reactive Updates)
    • 元件就像是函數
    • JSX 語法
    • 沒有 JSX 的 React
    • JSX in Depth
      • 為什麼要使用 JSX？
      • HTML 標籤 vs. React 元件
      • 轉換
      • 命名空間的元件
      • JavaScript 表達式
        • 屬性表達式
        • 布林屬性
        • 子節點表達式
        • 註釋
    • JSX 擴展屬性
      • 修改Props 是不好的
      • 這個奇怪的...標記是什麼？
    • JSX 陷阱
      • HTML 實體
      • 自定義 HTML 屬性
  • Interactivity and Dynamic UIs
    • 簡單例子
    • 事件處理與合成事件（Synthetic Events）
    • 幕後原理：自動綁定和事件代理
    • 元件其實是狀態機（State Machines）
    • State 工作原理
    • 哪些元件應該有 State？
    • 哪些應該在 State 做？
    • 哪些不應該在 State 做？
  • 複合元件 (Multiple Components)
    • 動機：關注分離
    • 組合實例
    • 從屬關係
    • 子級
      • 子級校正（Reconciliation）
      • 子元件狀態管理
      • 動態子級
    • 資料流
    • A Note on Performance
• Chapter 4：Reference
• Chapter 5：Flux
• Chapter 6：Tips