大前端三劍客：Vue+React+Flutter

第1篇基礎(chǔ)篇
第1章大前端發(fā)展趨勢
1.1大前端的發(fā)展過程
1.2Node.js引領(lǐng)JavaScript進(jìn)入全棧時(shí)代
1.3小程序、輕應(yīng)用開啟前端新模式
1.4Flutter引領(lǐng)跨平臺(tái)開發(fā)
1.5華為ArkUI探索物聯(lián)網(wǎng)全場景開發(fā)
1.6大前端的革命與未來
第2章ECMAScript 6
2.1ECMAScript 6介紹
2.2Babel轉(zhuǎn)碼器
2.3let和const
2.4解構(gòu)賦值
2.5字符串的擴(kuò)展
2.5.1字符串新增方法
2.5.2字符串模板
2.6數(shù)組的擴(kuò)展
2.6.1擴(kuò)展運(yùn)算符
2.6.2Array.from()
2.6.3Array.of()
2.6.4Array.find() 和 Array.findIndex()
2.6.5Array.includes()
2.6.6Array.copyWithin()
2.6.7Array.entries().keys().values()
2.6.8Array.fill()
2.6.9flat()、flatMap()
2.7對象的擴(kuò)展
2.7.1對象字面量
2.7.2屬性名表達(dá)式
2.7.3super關(guān)鍵字
2.7.4對象的擴(kuò)展運(yùn)算符
2.8Symbol
2.9Set和Map數(shù)據(jù)結(jié)構(gòu)
2.9.1Map對象
2.9.2Set 對象
2.10Proxy
2.11Reflect
2.11.1Reflect()靜態(tài)方法
2.11.2Reflect與Proxy組合使用
2.12異步編程
2.12.1Promise
2.12.2Generator
2.12.3async/await
2.13類的用法
2.13.1類的定義
2.13.2類的構(gòu)造函數(shù)與實(shí)例
2.13.3類的屬性和方法
2.13.4類的繼承
2.14模塊化Module
2.14.1ECMAScript 6的模塊化特點(diǎn)
2.14.2模塊化開發(fā)的優(yōu)缺點(diǎn)
2.14.3模塊的定義
2.14.4模塊的導(dǎo)出
2.14.5模塊的導(dǎo)入
第3章前端構(gòu)建工具
3.1前端構(gòu)建工具介紹
3.1.1為什么需要構(gòu)建工具
3.1.2構(gòu)建工具的功能需求
3.1.3前端構(gòu)建工具演變
3.1.4NPM與Yarn、PNPM
3.2Webpack
3.2.1Webpack介紹
3.2.2Webpack安裝與配置
3.2.3Webpack基礎(chǔ)
3.2.4Webpack進(jìn)階
3.3Rollup
3.3.1Rollup介紹
3.3.2Rollup安裝與配置
3.3.3Rollup基礎(chǔ)
3.4ESBuild
3.5Vite
3.5.1Vite介紹
3.5.2Vite基本使用
3.5.3Vite原理
第4章TypeScript
4.1TypeScript介紹
4.2TypeScript安裝與配置
4.3TypeScript基礎(chǔ)數(shù)據(jù)類型
4.4TypeScript高級(jí)數(shù)據(jù)類型
4.4.1泛型
4.4.2交叉類型
4.4.3聯(lián)合類型
4.5TypeScript面向?qū)ο筇匦?br />4.5.1類
4.5.2接口
4.6TypeScript裝飾器
4.6.1屬性裝飾器
4.6.2方法裝飾器
4.6.3參數(shù)裝飾器
4.6.4類裝飾器
4.7TypeScript模塊與命名空間
4.7.1模塊
4.7.2命名空間
第5章Dart語言
5.1Dart語言介紹
5.2安裝與配置
5.3第1個(gè)Dart程序
5.4變量與常量
5.5內(nèi)置類型
5.6函數(shù)
5.7運(yùn)算符
5.8分支與循環(huán)
5.9異常處理
5.10面向?qū)ο缶幊?br />5.10.1類與對象
5.10.2類的繼承
5.10.3抽象類
5.10.4多態(tài)
5.10.5隱式接口
5.10.6擴(kuò)展類
5.11泛型
5.12異步支持
5.12.1Future對象
5.12.2async函數(shù)與await表達(dá)式
5.13庫和庫包
5.13.1庫
5.13.2自定義庫包
5.13.3系統(tǒng)庫
5.13.4第三方庫
第6章包管理與腳手架
6.1MonoRepo包管理
6.1.1單倉與多倉庫管理
6.1.2Lerna包管理工具介紹
6.1.3Lerna包組織結(jié)構(gòu)
6.1.4Lerna安裝與配置
6.1.5Lerna操作流程演示
6.1.6Yarn Workspace
6.1.7Yarn Workspace與Lerna
6.2設(shè)計(jì)一個(gè)企業(yè)級(jí)腳手架工具
6.2.1腳手架作用
6.2.2常見的腳手架工具
6.2.3腳手架思路
6.2.4第三方依賴介紹
6.2.5腳手架架構(gòu)圖
6.2.6創(chuàng)建腳手架工程與測試發(fā)布
6.2.7腳手架命令行開發(fā)
第2篇Vue 3框架篇
第7章Vue 3語法基礎(chǔ)
7.1Vue 3框架介紹
7.1.1Vue 3框架核心思想
7.1.2Vue 3框架的新特征
7.2Vue 3開發(fā)環(huán)境搭建
7.2.1Visual Code安裝與配置
7.2.2安裝Vue DevTools
7.2.3編寫第1個(gè)Vue 3程序
7.3Vue 3項(xiàng)目搭建方法
7.3.1手動(dòng)搭建Vue 3項(xiàng)目
7.3.2通過腳手架工具搭建Vue 3項(xiàng)目
7.3.3Vue 3項(xiàng)目目錄結(jié)構(gòu)
7.4Vue 3應(yīng)用創(chuàng)建
7.4.1createApp()方法
7.4.2數(shù)據(jù)屬性和方法
7.4.3計(jì)算屬性和監(jiān)聽器
7.4.4模板和render()函數(shù)
7.5Vue 3模板語法
7.5.1插值表達(dá)式
7.5.2什么是指令
7.5.3數(shù)據(jù)綁定指令
7.5.4class與style綁定
7.5.5條件指令
7.5.6循環(huán)指令
7.5.7事件綁定指令
7.5.8表單綁定指令
7.5.9案例： 省市區(qū)多級(jí)聯(lián)動(dòng)效果
7.6Vue 3組件開發(fā)
7.6.1組件定義
7.6.2組件的命名規(guī)則
7.6.3組件的結(jié)構(gòu)
7.6.4組件的接口屬性
7.6.5組件的生命周期方法
7.6.6組件的插槽
7.6.7提供/注入模式
7.6.8動(dòng)態(tài)組件與異步組件
7.6.9混入
7.7響應(yīng)性API
7.7.1setup()
7.7.2ref()
7.7.3reactive()
7.7.4toRef
7.7.5toRefs()
7.7.6computed()
7.7.7watch()
7.7.8watchEffect
7.7.9setup()生命周期函數(shù)
7.7.10單頁面組件
7.7.11Provide與Inject
7.8Vue 3過渡和動(dòng)畫
7.8.1過渡與動(dòng)畫
7.8.2Transition和TransitionGroup組件
7.8.3進(jìn)入過渡與離開過渡
7.8.4案例： 飛到購物車動(dòng)畫
7.9Vue 3復(fù)用與組合
7.9.1自定義指令
7.9.2Teleport
7.9.3插件
7.10Vue 3路由
7.10.1路由入門
7.10.2路由參數(shù)傳遞
7.10.3嵌套模式路由
7.10.4命名視圖
7.10.5路由守衛(wèi)
7.10.6數(shù)據(jù)獲取
7.11Vue 3狀態(tài)管理(Vuex)
7.11.1狀態(tài)管理模式
7.11.2Vuex和全局變量的概念區(qū)別
7.11.3Vuex中的5個(gè)重要屬性
7.11.4Vuex開發(fā)入門基礎(chǔ)
7.11.5Vuex開發(fā)實(shí)踐
7.11.6Vuex中組合式API的用法
7.12Vue 3狀態(tài)管理(Pinia)
7.12.1Pinia與Vuex寫法比較
7.12.2Pinia安裝和集成
7.12.3Pinia核心概念
第8章Vue 3進(jìn)階原理
8.1Vue 3源碼安裝編譯與調(diào)試
8.1.1Vue 3源碼包介紹
8.1.2Vue 3源碼下載與編譯
8.2Vue 3響應(yīng)式數(shù)據(jù)系統(tǒng)核心原理
8.2.1reactivity模塊介紹
8.2.2reactivity模塊使用
8.2.3reactive實(shí)現(xiàn)原理
8.2.4依賴收集與派發(fā)更新
8.2.5Vue 3響應(yīng)式原理總結(jié)
8.3Vue 2 Diff算法(雙端Diff算法)
8.3.1雙端Diff算法原理
8.3.2非理性狀態(tài)的處理方式
8.4Vue 3 Diff算法(快速Diff算法)
第9章Vue 3組件庫開發(fā)實(shí)戰(zhàn)
9.1如何設(shè)計(jì)一個(gè)組件庫
9.1.1組件庫設(shè)計(jì)方法論
9.1.2組件庫的設(shè)計(jì)原則
9.1.3組件庫開發(fā)的技術(shù)選型
9.1.4組件框架樣式主題設(shè)計(jì)
9.2搭建組件庫項(xiàng)目
9.2.1搭建MonoRepo項(xiàng)目結(jié)構(gòu)
9.2.2搭建基礎(chǔ)組件庫(packages/vueui3)
9.2.3搭建主題樣式項(xiàng)目
9.3組件庫詳細(xì)設(shè)計(jì)
9.3.1Icon圖標(biāo)組件
9.3.2Button組件
9.4搭建Playgrounds項(xiàng)目
9.4.1創(chuàng)建Playgrounds項(xiàng)目
9.4.2測試Playgrounds項(xiàng)目
9.5組件庫發(fā)布與集成
9.5.1添加publishConfig配置
9.5.2設(shè)置發(fā)布包的文件或者目錄
9.5.3提交代碼到Git倉庫
9.5.4使用Commitizen規(guī)范的commit message
9.5.5使用Lint Husky規(guī)范的commit message
9.5.6使用Lerna生成changelogs
9.5.7將庫發(fā)布到npmjs網(wǎng)站
第3篇React框架篇
第10章React語法基礎(chǔ)
10.1框架介紹
10.1.1React框架由來
10.1.2React框架特點(diǎn)
10.2開發(fā)準(zhǔn)備
10.2.1手動(dòng)搭建React項(xiàng)目
10.2.2通過腳手架工具搭建React項(xiàng)目
10.2.3安裝React調(diào)試工具
10.3JSX與虛擬DOM
10.3.1JSX語法介紹
10.3.2React.createElement和虛擬DOM
10.3.3事件處理
10.3.4條件渲染
10.3.5列表與Key
10.4元素渲染
10.4.1客戶端渲染
10.4.2服務(wù)器端渲染
10.5組件
10.5.1React元素與組件的區(qū)別
10.5.2創(chuàng)建組件
10.5.3組件的輸入接口
10.5.4組件的狀態(tài)
10.5.5組件中函數(shù)處理
10.5.6組件的生命周期
10.5.7組件的引用
10.6組件設(shè)計(jì)與優(yōu)化
10.6.1高階組件
10.6.2Context模式
10.6.3Component 與PureComponent
10.6.4React.memo
10.6.5組件懶加載
10.6.6Portals
10.7React Hook
10.7.1React Hook介紹
10.7.2useState()
10.7.3useEffect()
10.7.4useLayoutEffect()
10.7.5useRef()
10.7.6useCallback()與useMemo()
10.7.7useContext()
10.7.8useReducer()
10.7.9自定義Hook
10.8路由(React Router)
10.8.1安裝React Router
10.8.2兩種模式的路由
10.8.3簡單路由
10.8.4嵌套模式路由
10.8.5路由參數(shù)
10.8.6編程式路由導(dǎo)航
10.8.7多個(gè)Routes/
10.9狀態(tài)管理(Redux)
10.9.1Redux介紹
10.9.2Redux基本用法
10.9.3Redux核心對象
10.9.4Redux中間件介紹
10.9.5Redux中間件(reduxthunk)
10.9.6Redux中間件(reduxsaga)
10.9.7Redux Toolkit簡化Redux代碼
10.10狀態(tài)管理(Recoil)
10.10.1Recoil介紹
10.10.2Recoil核心概念
10.10.3Recoil核心API
10.11React移動(dòng)端開發(fā)(React Native)
10.11.1React Native優(yōu)點(diǎn)
10.11.2React Native安裝與配置
第11章React進(jìn)階原理
11.1React源碼調(diào)試
11.1.1React源碼下載與編譯
11.1.2React源碼包介紹
11.2React架構(gòu)原理
11.2.1React 15版架構(gòu) 
11.2.2React 16版架構(gòu) 
11.2.3React Scheduler實(shí)現(xiàn)
第12章React組件庫開發(fā)實(shí)戰(zhàn)
12.1React組件庫設(shè)計(jì)準(zhǔn)備
12.1.1組件庫設(shè)計(jì)基本目標(biāo)
12.1.2組件庫技術(shù)選型
12.2搭建React組件庫(MonoRepo)
12.2.1初始化Lerna項(xiàng)目
12.2.2創(chuàng)建React組件庫(Package)
12.2.3創(chuàng)建一個(gè)Button組件
12.2.4使用Rollup進(jìn)行組件庫打包
12.3創(chuàng)建Playgrounds
12.4通過Jest搭建組件庫測試
12.4.1安裝配置測試框架
12.4.2編寫組件測試代碼
12.4.3啟動(dòng)單元測試
12.5使用Storybook搭建組件文檔
12.6將組件庫發(fā)布到NPM
第4篇Flutter 2框架篇
第13章Flutter語法基礎(chǔ)
13.1Flutter介紹
13.2開發(fā)環(huán)境搭建
13.2.1Windows安裝配置Flutter SDK
13.2.2macOS安裝配置Flutter SDK
13.2.3配置VS Code開發(fā)Flutter
13.3第1個(gè)Flutter應(yīng)用
13.3.1創(chuàng)建Flutter App項(xiàng)目
13.3.2編寫Flutter App界面
13.3.3添加交互邏輯
13.4組件
13.5包管理
13.5.1pubspec.yaml文件
13.5.2通過pub倉庫管理包
13.5.3以其他方式管理包
13.6資源管理
13.6.1圖片資源管理
13.6.2多像素密度的圖片管理
13.6.3字體資源的聲明
13.6.4原生平臺(tái)的資源設(shè)置
13.7組件設(shè)計(jì)風(fēng)格
13.7.1Material(Android)風(fēng)格組件
13.7.2Cupertino(iOS)風(fēng)格組件
13.8尺寸單位與適配
13.9基礎(chǔ)組件
13.9.1基礎(chǔ)組件介紹
13.9.2構(gòu)建布局
13.9.3列表與可滾動(dòng)組件
13.9.4表單組件
13.10路由管理
13.10.1路由的基礎(chǔ)用法
13.10.2路由傳值
13.10.3命名路由
13.10.4路由攔截
13.10.5嵌套模式路由
13.11事件處理與通知
13.11.1原始指針事件
13.11.2手勢識(shí)別
13.11.3全局事件總線
13.11.4事件通知
13.12網(wǎng)絡(luò)
13.12.1HttpClient
13.12.2HTTP庫
13.12.3Dio庫
13.12.4WebSocket
13.12.5Isolate
13.13狀態(tài)管理
13.13.1InheritedWidget
13.13.2scoped_model
13.14Stream與BLoC模式
13.14.1Stream
13.14.2RxDart
13.14.3BLoC模式
第14章Flutter Web和桌面應(yīng)用
14.1Flutter Web介紹
14.1.1Flutter Web框架架構(gòu)
14.1.2Flutter Web的兩種編譯器
14.1.3Flutter Web支持的兩種渲染模式
14.1.4創(chuàng)建一個(gè)Flutter Web項(xiàng)目
14.2Flutter Desktop介紹
14.3Flutter Desktop開發(fā)案例
第15章Flutter插件庫開發(fā)實(shí)戰(zhàn)
15.1Flutter插件庫開發(fā)介紹
15.2Flutter自定義組件庫的3種方式
15.3Flutter自定義插件(Plugin)
15.4在Pub上發(fā)布自己的Package