明确进阶门槛与核心痛点
这套 React 进阶资料并非给纯新手做的零基础入门，而是专门针对已经掌握 JSX、组件生命周期等基础语法，但在实际工作中遇到“状态管理混乱”、“代码耦合度高”或“面试被问底层原理卡壳”的开发者。它解决的核心问题是：如何从“能写页面”跃升到“能维护企业级项目”。内容涵盖了 Hooks 的深层原理、多种状态管理方案的选型对比、自动化测试体系以及组件库文档工程化。如果你还在纠结 CSS 布局或初学 JavaScript，先修好基础再来；如果你正被“为什么用 useMemo”、“Redux 中间件如何工作”这类问题困扰，这套资料正是为你准备的。它不提供保姆式的代码复制粘贴，而是强调“理解为什么这么做”，适合有一定独立开发经验、希望突破技术天花板的上班族。
优化学习顺序与聚焦重点
资料包含多个模块，建议按照“底层原理 -> 状态管理 -> 质量保障 -> 工程化输出”的顺序攻克，避免陷入琐碎细节。首先，务必深耕 Hooks 章节，重点消化 useReducer、useMemo 的性能优化逻辑以及手写 useEffect 的原理解析，这是理解 React 响应式机制的关键，也是面试高频考点。其次，进入状态管理对比环节，不要死记硬背 API，而要厘清 Redux-thunk、redux-toolkit 和 Mobx 在大型项目中的适用边界，理解其源码级的数据流向。接着，将重心放在 Jest 自动化测试章节，掌握 testing-library 的用法和 Mock 函数配置，这是保证业务代码稳定性的必备技能。关于动画方案（TransitionGroup）和文档工具（Storybook/Vite-pages），属于“锦上添花”的内容，若时间紧张，可将其作为选学部分，用于完善组件库开发的最后一步。
落地产出与资料配合技巧
学完这套资料，你的产出不应仅是“看完了”，而是能独立承担中大型 React 项目的核心模块开发。具体而言，你应当能够设计出可测试的组件架构，制定团队统一的状态管理规范，并搭建自动化测试流程。资料包中视频较长，切忌被动观看，必须配合本地 IDE 动手复现。针对状态管理部分，建议从零搭建一个最小化 Demo，手动实现一个简单的中间件，以验证对源码解析的理解；针对测试部分，尝试为你现有的业务组件编写至少 3 个核心场景的测试用例，确保覆盖主要交互逻辑。这种“视频理论输入 + 本地代码复现”的刻意练习方式，比单纯收藏视频更能将知识转化为职场竞争力。当你能够清晰地解释“为什么在该场景下选择 Mobx 而非 Redux”或“如何优化长列表渲染性能”时，这套资料的价值才真正兑现。
课程目录
📁 {8}--阶段八：React17框架与源码解析（拔高） 📁 {4}--React工程化&性能优化 📁 {2}--第2章React动画方案TransitionGroup [8.4.2.2]--2-2CSS动画实践：Menu组件添加展开图标.mp4
[51.4 MB] [8.4.2.3]--2-3官方推荐的动画库ReactTransitionGroup.mp4
[72.9 MB] [8.4.2.4]--2-4CSSTransiton应用&解释appear应用场景.mp4
[8.4.2.1]--2-1三种React中动画方案.mp4
[28.9 MB] [8.4.2.5]--2-5封装Transiton动画组件&增加Menu控制动画属性.mp4
[121.6 MB] 📁 {3}--第3章React组件自动化测试 [8.4.3.3]--3-3Jest常见配置项解读&组件库项目配置.mp4
[56.1 MB] [8.4.3.8]--3-8添加Menu组件测试.mp4
[91.4 MB] [8.4.3.4]--3-4React官方推荐测试库testing-library.mp4
[59.2 MB] [8.4.3.7]--3-7完成Button组件所有测试用例.mp4
[39.2 MB] [8.4.3.2]--3-2Jest上手&搭建测试环境.mp4
[153.4 MB] [8.4.3.1]--3-1什么是自动化测试？常见的测试工具.mp4
[29.0 MB] [8.4.3.9]--3-9Menu组件点击事件测试.mp4
[30.0 MB] [8.4.3.6]--3-6Jest核心概念Mock函数.mp4
[60.4 MB] [8.4.3.5]--3-5创建Button测试用例集&VSCodeJest插件.mp4
[78.7 MB] 📁 {1}--第1章周导读 [8.1.1.1]--1-1章导学.mp4
[24.7 MB] 📁 {4}--第4章组件库文档方案 [8.4.4.3]--4-3组件库文档方案2：vite-pages集成.mp4
[99.9 MB] [8.4.4.2]--4-2组件库文档方案1：Storybook集成.mp4
[55.8 MB] [8.4.4.1]--4-1文档工具推荐vite-pages&storybook.mp4
[98.6 MB] 📁 {2}--React-Hooks&状态管理方案 📁 {1}--第1章ReactHooks及状态管理方案章导学 [8.2.1.1]--1-1章导学.mp4
[5.6 MB] 📁 {3}--第3章react中常见的状态管理方案 [8.2.3.4]--3-4redux-saga异步中间件.mp4
[68.6 MB] [8.2.3.2]--3-2Redux-thunk异步中间件.mp4
[124.7 MB] [8.2.3.7]--3-7Mobx状态管理方案.mp4
[152.2 MB] [8.2.3.6]--3-6redux-toolkit核心API.mp4
[118.4 MB] [8.2.3.3]--3-3redux中间件工作原理(redux-thunk源码解析).mp4
[91.2 MB] [8.2.3.5]--3-5为什么现在主流的项目都会用redux-toolkit？.mp4
[135.4 MB] [8.2.3.1]--3-1React中状态管理方案导学.mp4
[60.0 MB] 📁 {2}--第2章HooksAPI及hooks原理解析 [8.2.2.6]--2-6useRef用法.mp4
[29.1 MB] [8.2.2.5]--2-5useReducer用法.mp4
[81.3 MB] [8.2.2.11]--2-11hooks的工作原理（手写useEffect）.mp4
[90.9 MB] [8.2.2.7]--2-7useMemo&useCallback.mp4
[52.7 MB] [8.2.2.10]--2-10hooks的工作原理（手写useState）.mp4
[78.6 MB] [8.2.2.4]--2-4useContext用法.mp4
[54.6 MB] [8.2.2.12]--2-12Hooks案例todolist+五种CSS方案1.mp4
[115.4 MB] [8.2.2.9]--2-9开发技巧与常见hooks资源(vueuse&usehook.mp4
[54.2 MB] [8.2.2.13]--2-13五种CSS方案2（全局、模块化、CSSinJS）.mp4
[68.1 MB] [8.2.2.8]--2-8自定义hook-useLocalStorage.mp4
[75.9 MB] [8.2.2.2]--2-2ReactHooks一览与useState.mp4
[81.6 MB] [8.2.2.3]--2-3useEffect用法.mp4
[30.7 MB] 📁 {1}--React17新特性 📁 {4}--第4章企业级应用框架和常见技术集成方案 [8.1.4.4]--4-4快速上手umi3.mp4
[111.1 MB] [8.1.4.1]--4-1React源代码调试方法.mp4
[143.4 MB] [8.1.4.2]--4-2调试进阶（第三方调试库&watch模式下的调试）.mp4
[94.2 MB] [8.1.4.5]--4-5代码提交msg校验整合（commitizen&commit.mp4
[39.2 MB] [8.1.4.7]--4-7umi&qiankun微前端实践.mp4
[105.7 MB] [8.1.4.8]--4-8vite及react模板项目.mp4
[21.0 MB] [8.1.4.3]--4-3create-react-app&模板cra-templa.mp4
[69.1 MB] [8.1.4.6]--4-6umi常见的插件集成(sass&dva&model&qia.mp4
[50.0 MB] 📁 {2}--第2章react设计思想与核心概念 [8.2.2.11]--2-11hooks的工作原理（手写useEffect）.mp4
[101.2 MB] [8.2.2.9]--2-9开发技巧与常见hooks资源(vueuse&usehook.mp4
[62.3 MB] [8.1.2.2]--2-2React设计思想与优势.mp4
[121.4 MB] [8.2.2.3]--2-3useEffect用法.mp4
[30.3 MB] [8.2.2.13]--2-13五种CSS方案2（全局、模块化、CSSinJS）.mp4
[67.5 MB] [8.2.2.12]--2-12Hooks案例todolist+五种CSS方案1.mp4
[129.4 MB] [8.1.2.4]--2-4React核心概念（二）：协调概念以及Diff算法.mp4
[37.7 MB] [8.2.2.7]--2-7useMemo&useCallback.mp4
[57.9 MB] [8.2.2.10]--2-10hooks的工作原理（手写useState）.mp4
[87.1 MB] [8.2.2.6]--2-6useRef用法.mp4
[31.1 MB] [8.2.2.4]--2-4useContext用法.mp4
[62.6 MB] [8.2.2.8]--2-8自定义hook-useLocalStorage.mp4
[97.8 MB] [8.1.2.1]--2-1React16-18有哪些变化？带来了哪些惊喜？.mp4
[67.7 MB] [8.1.2.5]--2-5React核心概念（三）：渲染与高性能原因.mp4
[18.3 MB] [8.2.2.2]--2-2ReactHooks一览与useState.mp4
[97.2 MB] [8.1.2.3]--2-3React核心概念（一）：组件&元素&实例.mp4
[76.3 MB] [8.2.2.5]--2-5useReducer用法.mp4
[91.8 MB] 📁 {5}--第5章react-routerv6实战 [8.1.5.2]--5-2react-router最新v6版本带来了哪些变化.mp4
[92.0 MB] [8.1.5.3]--5-3react-routerv6简明示例.mp4
[61.8 MB] [8.1.5.1]--5-1React-Router章导学.mp4
[34.7 MB] [8.1.5.5]--5-5自定义路由导航守卫.mp4
[124.8 MB] [8.1.5.4]--5-4404页面&路由query&路径传参.mp4
[91.0 MB] 📁 {1}--第1章章导学 📁 {3}--第3章react的全新架构Fiber及其工作原理 [8.1.3.4]--3-4Fiber带来的Effects（效应）.mp4
[19.2 MB] [8.1.3.1]--3-1React15架构卡顿的原因.mp4
[39.2 MB] [8.1.3.3]--3-3Fiber树与双缓存技术（任务优先级）.mp4
[46.6 MB] [8.1.3.2]--3-2什么是Fiber架构？Fiber对象.mp4
[41.7 MB] 📁 {3}--React组件库设计&工程化 📁 {4}--第4章图标组件（集成公共图标+iconfont） [8.3.4.2]--4-2Icon组件UML类图设计.mp4
[34.1 MB] [8.3.4.1]--4-1icon组件设计&react-icons库推荐.mp4
[95.1 MB] [8.3.4.3]--4-3自定义Icon组件1.mp4
[106.1 MB] [8.3.4.4]--4-4自定义Icon组件2.mp4
[103.1 MB] 📁 {5}--第5章菜单组件&子菜单组件 [8.3.5.1]--5-1Menu组件设计&整体考虑.mp4
[31.2 MB] [8.3.5.2]--5-2Menu组件UML图分析.mp4
[41.4 MB] [8.3.5.3]--5-3自定义Menu组件1.mp4
[62.0 MB] [8.3.5.7]--5-7完成Menu组件的样式.mp4
[109.0 MB] [8.3.5.6]--5-6React.Children.map与React.mp4
[109.0 MB] [8.3.5.4]--5-4自定义Menu组件2.mp4
[90.0 MB] [8.3.5.5]--5-5子菜单SubMenu组件及事件绑定.mp4
[90.8 MB] 📁 {3}--第3章按钮组件 [8.3.3.2]--3-2Button组件设计与前置准备.mp4
[102.0 MB] [8.3.3.4]--3-4Button样式设计1.mp4
[95.9 MB] [8.3.3.6]--3-6完成Button组件（加入loading效果）.mp4
[44.0 MB] [8.3.3.3]--3-3Button组件Interface&基础分类button与.mp4
[59.5 MB] [8.3.3.5]--3-5Button样式设计2.mp4
[58.6 MB] 📁 {1}--第1章周导学 [8.3.1.1]--1-1章导学.mp4
[7.5 MB] 📁 {2}--第2章组件库整体需求分析与工程化模板 [8.3.2.7]--2-7色彩设计（借助SemiDSM快速设计色彩方案）.mp4
[104.5 MB] [8.3.2.6]--2-6使用Vite打包library配置.mp4
[92.2 MB] [8.3.2.1]--2-1组件库需求分析.mp4
[58.4 MB] [8.3.2.8]--2-8公共样式配置（两种策略）.mp4
[90.8 MB] [8.3.2.3]--2-3初始化项目的两种方案（cra模板项目）.mp4
[76.8 MB] [8.3.2.5]--2-5stylelint配置.mp4
[65.4 MB] [8.3.2.2]--2-2课程组件库整体设计&样式方案介绍.mp4
[114.3 MB] [8.3.2.4]--2-4初始化项目的两种方案（vite模板项目+CHANGELOG.mp4
[88.9 MB] 📁 {6}--第6章输入框组件 [8.3.6.3]--6-3自定义Input组件-基础结构.mp4
[57.4 MB] [8.3.6.2]--6-2Input组件UML类图分析.mp4
[31.2 MB] [8.3.6.6]--6-6Input组件allowClear功能.mp4
[66.7 MB] [8.3.6.5]--6-5Input组件suffix&prefix&disabled.mp4
[39.3 MB] [8.3.6.1]--6-1Input组件设计&整体思考.mp4
[17.1 MB] [8.3.6.4]--6-4完成Input组件样式.mp4
[112.8 MB] 📁 {2}--阶段二：项目全流程DevOps 📁 {3}--团队协作-自动化流程 📁 {1}--第1章深入浅出前端自动化 [2.3.1.1]--1-1章导读【小荷才露尖尖角，揭开自动化的面纱】.mp4
[47.6 MB] [2.3.1.2]--1-2什么是前端自动化？什么是CICD？.mp4
[137.9 MB] [2.3.1.3]--1-4自动化流程概念&最佳实践.mp4
[50.4 MB] 📁 {3}--第3章Jenkins—CI&CD工具鼻祖 [2.3.3.1]--3-1Jenkins使用介绍&课程案例架构.mp4
[101.3 MB] [2.3.3.2]--3-3Jenkins安装&Docker安装示例.mp4
[52.8 MB] [2.3.3.5]--3-12Jenkins&gitlab项目任务.mp4
[62.9 MB] [2.3.3.3]--3-7Jenkins插件配置&保存Docker容器数据.mp4
[109.0 MB] [2.3.3.4]--3-10Jenkins权限管理3种方案.mp4
[99.0 MB] 📁 {0}--附件 📁 {4}--第4章自动化实战 [2.3.4.4]--4-4前后端项目Jenkins任务配置（2）.mp4
[120.0 MB] [2.3.4.3]--4-3前后端项目Jenkins任务配置（1）.mp4
[48.6 MB] [2.3.4.1]--4-1前后端项目Dockerfile&项目实战配置.mp4
[106.3 MB] 📁 {2}--第2章CircleCITravisCI自动化工具合集 [2.3.2.3]--2-7CircleCI实战Vue项目发布到githubpages.mp4
[108.7 MB] [2.3.2.1]--2-1自动化工具介绍&CircleCI使用.mp4
[145.3 MB] [2.3.2.2]--2-4CircleCI配置自动化任务—打包构建.mp4
[106.8 MB] 📁 {5}--第5章GithubActions [2.3.5.3]--5-3GithubActions界面与设置.mp4
[2.3.5.4]--5-4同步Gitee代码的三种方式.mp4
[104.5 MB] [2.3.5.5]--5-5构建代码并发布GithubPages.mp4
[130.2 MB] [2.3.5.6]--5-6构建优化加入npm缓存.mp4
[63.3 MB] [2.3.5.10]--5-10[加餐]手动发布release&自动生成发行说明.mp4
[64.9 MB] [2.3.5.9]--5-9自动管理githubissues并打标签.mp4
[59.9 MB] [2.3.5.2]--5-2Github加速DevSideCar.mp4
[19.1 MB] [2.3.5.8]--5-8GA作业&rsync发布至服务器.mp4
[111.8 MB] [2.3.5.11]--5-11使用GithubActions自动发布Release.mp4
[80.3 MB] [2.3.5.7]--5-7使用GithubActions自动化发布GiteePage.mp4
[91.6 MB] [2.3.5.12]--5-12常见的Actions推荐&如何自建GithubActio.mp4
[45.9 MB] [2.3.5.1]--5-1章导学：githubactions.mp4
[40.8 MB] 📁 {2}--团队协作-版本管理 📁 {1}--第1章项目开发团队协作——版本管理 [2.2.1.18]--1-30【温故知新】章总结.mp4
[4.5 MB] [2.2.1.7]--1-12github仓库settings介绍（版本控制工具git.mp4
[15.5 MB] [2.2.1.14]--1-26docker-compose运维gitlab平台：备份&.mp4
[31.1 MB] [2.2.1.8]--1-14深入理解git工作原理——快照管理（版本控制工具git）.mp4
[105.3 MB] [2.2.1.1]--1-1章导学（敏捷流程之版本控制宝鉴）-.mp4
[28.6 MB] [2.2.1.15]--1-27gitlab的权限介绍&组权限控制&分支保护.mp4
[63.2 MB] [2.2.1.6]--1-11情境二：推送代码到多个仓库（版本控制工具git）.mp4
[19.0 MB] [2.2.1.13]--1-25docker-compose搭建gitlab平台（自动动.mp4
[39.4 MB] [2.2.1.4]--1-8从零配置github到SSH秘钥克隆仓库（版本控制工具gi.mp4
[62.7 MB] [2.2.1.5]--1-10情景一：空仓库&创建仓库提交代码（版本控制工具git）.mp4
[52.0 MB] [2.2.1.2]--1-2语义化版本SemanticVersioning（版本控制基.mp4
[32.7 MB] [2.2.1.9]--1-16两种应用场景下的gitflow模型（多人协作gitflo.mp4
[94.6 MB] [2.2.1.10]--1-19分支管理的基础命令介绍（多人协作之分支管理）.mp4
[139.4 MB] [2.2.1.11]--1-21实操gitflow&常见问题（多人协作之分支管理）.mp4
[87.6 MB] [2.2.1.16]--1-28三种方法产生.gitignore文件（git必备知识）.mp4
[89.3 MB] [2.2.1.3]--1-5git工具导学&gitvssvn&git多密钥管理.mp4
[136.4 MB] [2.2.1.17]--1-29Git的GUI工具使用简介.mp4
[2.2.1.12]--1-24dockerrun搭建gitlab平台.mp4
[79.0 MB] 📁 {0}--附件 (2.2.3)--gitlab配置HTTPS与邮件服务.pdf
[546.3 KB] (2.2.2)--gitsubmodule.pdf
[420.8 KB] (2.2.4)--开源许可协议.pdf
[613.3 KB] (2.2.1)--Typora中Table进阶使用.pdf
[596.6 KB] (2.2.5)--使用gitsubtree管理项目中的子库.pdf
[530.8 KB] (2.2.7)--学习Markdown语法.pdf
[421.8 KB] 📁 {1}--团队协作-文档管理与缺陷控制 📁 {3}--第3章缺陷控制之质量管理工具 [2.1.3.4]--3-8Vue项目中使用VSCode插件自动格式化+自动ESLin.mp4
[40.6 MB] [2.1.3.2]--3-4ESLint规则&配置方法.mp4
[31.8 MB] [2.1.3.1]--3-1ESLint安装&初始化.mp4
[104.2 MB] [2.1.3.3]--3-7ESLint与VSCode&Webstorm结合使用.mp4
[110.2 MB] [2.1.3.5]--3-9本章小结.mp4
[12.9 MB] 📁 {1}--第1章项目开发团队协作——文档管理 [2.1.1.9]--1-11云笔记&个人笔记使用指北（勤练习才能写好文档）-v2.0.mp4
[38.8 MB] [2.1.1.10]--1-12pages自建博客.mp4
[50.3 MB] [2.1.1.6]--1-64款文档管理工具介绍（思想决定视野，工具提升效率）.mp4
[66.8 MB] [2.1.1.1]--1-1章导读（敏捷流程之文档管理宝鉴）.mp4
[39.6 MB] [2.1.1.7]--1-8ShowDoc的本地化安装.mp4
[54.3 MB] … 其余 9
54 项略，目录共 1154 项
