React.js 小書(shū)
本文作者：胡子大哈
本文原文：React.js 小書(shū)
轉(zhuǎn)載請(qǐng)注明出處，保留原文鏈接以及作者信息
在線閱讀：http://huziketang.com/books/react/
簡(jiǎn)介
這是一本關(guān)于 React.js 的小書(shū)。
因?yàn)楣ぷ髦幸恢痹谑褂?React.js你踩，也一直以來(lái)想總結(jié)一下自己關(guān)于 React.js 的一些知識(shí)、經(jīng)驗(yàn)舅踪。于是把一些想法慢慢整理書(shū)寫(xiě)下來(lái)抚岗，做成一本開(kāi)源雇庙、免費(fèi)瞧甩、專業(yè)钉跷、簡(jiǎn)單的入門級(jí)別的小書(shū)，提供給社區(qū)亲配。希望能夠幫助到更多 React.js 剛?cè)腴T朋友尘应。
由于水平有限惶凝，編寫(xiě)的過(guò)程難免會(huì)有諸多錯(cuò)誤吼虎，也希望大家在看的過(guò)程中發(fā)現(xiàn)了問(wèn)題犬钢，可以在 Github 上給該項(xiàng)目發(fā) Pull Request。衷心希望可以有更多的人參與到本書(shū)的編寫(xiě)當(dāng)中思灰。
（本書(shū)的后續(xù)可能會(huì)做成視頻版本玷犹，敬請(qǐng)期待。）
本書(shū)介紹
本書(shū)為有一點(diǎn)前端基礎(chǔ)的并且是 React.js 零基礎(chǔ)的同學(xué)而作洒疚，幫助他們掌握 React.js 并且靈活地把 React.js 應(yīng)用到實(shí)際項(xiàng)目當(dāng)中歹颓。如果你有一定的 HTML、CSS油湖、JavaScript 基礎(chǔ)并且希望學(xué)習(xí) React.js巍扛，而又覺(jué)得 React.js 當(dāng)中有些概念比難以接受和理解，希望能夠從零開(kāi)始學(xué)習(xí)乏德，那么本書(shū)很適合你撤奸。但如果你已經(jīng)對(duì)前端已經(jīng)非常熟悉并且用過(guò)不少的前端框架和相關(guān)的組件化技術(shù)，建議你直接看官網(wǎng)文檔喊括。
本書(shū)并不會(huì)文檔式地包含所有知識(shí)點(diǎn)胧瓜，只會(huì)提煉實(shí)戰(zhàn)經(jīng)驗(yàn)中基礎(chǔ)的、重要的郑什、頻繁的知識(shí)進(jìn)行重點(diǎn)講解府喳，讓你能用最少的精力深入了解實(shí)戰(zhàn)中最需要的 React.js 知識(shí)和套路，輕裝上路蘑拯。如果需要更多更全面的知識(shí)點(diǎn)钝满，可以參看更多的官方文檔或者其他豐富的資料。
另外申窘，本書(shū)全書(shū)采用 ECMAScript 2015弯蚜，閱讀之前請(qǐng)確保自己已經(jīng)掌握了 ECMAScript 2015 的基本語(yǔ)法，否則閱讀起來(lái)會(huì)非常困難偶洋。
本書(shū)初定分為三個(gè)階段熟吏，每個(gè)階段最后會(huì)有實(shí)戰(zhàn)分析，把該階段的知識(shí)點(diǎn)應(yīng)用起來(lái)玄窝。
第一個(gè)階段：希望能讓讀者掌握 React.js 的基本概念和基礎(chǔ)知識(shí)牵寺。包括問(wèn)題的根源：前端組件的復(fù)用性問(wèn)題、數(shù)據(jù)和視圖的同步問(wèn)題恩脂。了解清楚問(wèn)題以后再了解 React.js 的基礎(chǔ)知識(shí)帽氓，包括 JSX、事件監(jiān)聽(tīng)俩块、state黎休、props浓领、列表渲染等∈迫看看 React.js 是怎么解決這些問(wèn)題的联贩。這個(gè)階段結(jié)束以后，讀者就可以可以運(yùn)用 React.js 構(gòu)建簡(jiǎn)單的頁(yè)面功能捎拯。
第二個(gè)階段：讓讀者更進(jìn)一步了解 React.js泪幌，包括組件生命周期及其含義、state 和 props 的進(jìn)階概念署照、props 驗(yàn)證及其意義祸泪、組件組合進(jìn)階、如何和 DOM 打交道建芙、并且開(kāi)始引入前端應(yīng)用狀態(tài)管理所存在的問(wèn)題没隘。
第三個(gè)階段：讓讀者掌握 React.js 較為高級(jí)的概念，包括高階組件禁荸、context右蒲。并且嘗試引入 React-router、redux 來(lái)協(xié)助我們構(gòu)建較為完整的前端應(yīng)用屡限；還會(huì)開(kāi)始深入討論前端應(yīng)用狀態(tài)管理的問(wèn)題品嚣。
目錄
第一個(gè)階段
- Lesson 1 - React.js 簡(jiǎn)介
- Lesson 2 - 前端組件化（一）：從一個(gè)簡(jiǎn)單的例子講起
- Lesson 3 - 前端組件化（二）：優(yōu)化 DOM 操作
- Lesson 4 - 前端組件化（三）：抽象出公共組件類
- Lesson 5 - React.js 基本環(huán)境安裝
- Lesson 6 - 使用 JSX 描述 UI 信息
- Lesson 7 - 組件的 render 方法
- Lesson 8 - 組件的組合、嵌套和組件樹(shù)
- Lesson 9 - 事件監(jiān)聽(tīng)
- Lesson 10 - 組件的 state 和 setState
- Lesson 11 - 配置組件的 props
- Lesson 12 - state vs props
- Lesson 13 - 渲染列表數(shù)據(jù)
- Lesson 14 - 實(shí)戰(zhàn)分析：評(píng)論功能（一）
- Lesson 15 - 實(shí)戰(zhàn)分析：評(píng)論功能（二）
- Lesson 16 - 實(shí)戰(zhàn)分析：評(píng)論功能（三）
第二個(gè)階段
- Lesson 17 - 前端應(yīng)用狀態(tài)管理 —— 狀態(tài)提升
- Lesson 18 - 掛載階段的組件生命周期（一）
- Lesson 19 - 掛載階段的組件生命周期（二）
- Lesson 20 - 更新階段的組件生命周期
- Lesson 21 - ref 和 React.js 中的 DOM 操作
- Lesson 22 - props.children 和容器類組件
- Lesson 23 - dangerouslySetHTML 和 style 屬性
- Lesson 24 - PropTypes 和組件參數(shù)驗(yàn)證
- Lesson 25 - 實(shí)戰(zhàn)分析：評(píng)論功能（四）
- Lesson 26 - 實(shí)戰(zhàn)分析：評(píng)論功能（五）
- Lesson 27 - 實(shí)戰(zhàn)分析：評(píng)論功能（六）
第三個(gè)階段
- Lesson 28 - 高階組件（Higher-Order Components）
- Lesson 29 - React.js 的 context
- Lesson 30 - 動(dòng)手實(shí)現(xiàn) Redux（一）：優(yōu)雅地修改共享狀態(tài)
- Lesson 31 - 動(dòng)手實(shí)現(xiàn) Redux（二）：抽離 store 和監(jiān)控?cái)?shù)據(jù)變化
- Lesson 32 - 動(dòng)手實(shí)現(xiàn) Redux（三）：純函數(shù)（Pure Function）簡(jiǎn)介
- Lesson 33 - 動(dòng)手實(shí)現(xiàn) Redux（四）：共享結(jié)構(gòu)的對(duì)象提高性能
- Lesson 34 - 動(dòng)手實(shí)現(xiàn) Redux（五）：不要問(wèn)為什么的 reducer
- Lesson 35 - 動(dòng)手實(shí)現(xiàn) Redux（六）：Redux 總結(jié)
- ...
特別鳴謝
特別感謝以下朋友對(duì)本書(shū)所做的審校工作钧大，給本書(shū)提出了很多寶貴的改進(jìn)意見(jiàn)：
聯(lián)系作者
- 郵箱：huzidaha@126.com
- 知乎：@胡子大哈
- 專欄：@前端大哈
- 加入《React.js 小書(shū)》讀者交流群翰撑，一起討論、交流啊央、學(xué)習(xí)前端技術(shù)眶诈。
License
本作品采用 署名-禁止演繹 4.0 國(guó)際許可協(xié)議 進(jìn)行許可
