Skip to content

Commit d66704c

Browse files
committed
docs: update
1 parent 52bb5ac commit d66704c

File tree

1 file changed

+85
-21
lines changed

1 file changed

+85
-21
lines changed

README.md

Lines changed: 85 additions & 21 deletions
Original file line numberDiff line numberDiff line change
@@ -8,26 +8,6 @@
88

99
[B 站](https://www.bilibili.com/video/BV1Zy4y1J73E) 提供了视频讲解使用方式
1010

11-
历经半年我把这个项目做成了一套系列视频课
12-
13-
[【课程介绍】](https://www.bilibili.com/video/BV16Z4y1r7Wp?spm_id_from=333.999.0.0)
14-
15-
课程的目标是通过构建自己的 mini-vue3 (同这个库一个复杂级别)来深入学习理解 vue3 源码
16-
17-
只有手写一遍,才能真正的掌握源码
18-
19-
进阶高级前端的编程思想有哪些
20-
21-
如何掌握 Vue3 源码原理实现
22-
23-
面试如何脱颖而出
24-
25-
帮你解决以上痛点问题 [胜利]
26-
27-
vx:cuixr1314
28-
29-
备注一下: github mini-vue
30-
3111
## Why
3212

3313
当我们需要深入学习 vue3 时,我们就需要看源码来学习,但是像这种工业级别的库,源码中有很多逻辑是用于处理边缘情况或者是兼容处理逻辑,是不利于我们学习的。
@@ -114,7 +94,7 @@ pnpm build
11494
#### 关键函数调用图
11595

11696

117-
![关键函数调用图2](https://user-gold-cdn.xitu.io/2020/6/22/172dc08840e25b42?w=1816&h=934&f=png&s=550722)
97+
![关键函数调用图2](https://images-1252602850.cos.ap-beijing.myqcloud.com/20220927170658.png)
11898

11999
> 可以基于函数名快速搜索到源码内容
120100
@@ -131,3 +111,87 @@ pnpm build
131111

132112
> 可以基于函数名快速搜索到源码内容
133113
114+
115+
116+
### 从零到一实现一遍
117+
118+
自从有了 mini-vue 之后 很多同学都问我 能不能带着他从零到一敲一遍
119+
120+
因为对于源码的学习来讲 看在多遍也不如自己写一遍
121+
122+
为此我把 mini-vue 做成了一套视频课 从零到一带着大家实现一遍 不跳过任何一行代码
123+
124+
当然除了功能上的实现还有编程思想融入到了课程内
125+
126+
比如 TDD、小步走、重构手法、TPP
127+
128+
> TDD 测试驱动开发 影响了我整个技术生涯 可以说在我认识到 TDD 之后 技术才有了质的飞跃
129+
130+
课程目录如下:
131+
132+
1. vue3 源码结构的介绍
133+
2. reactivity 的核心流程
134+
3. runtime-core 初始化的核心流程
135+
4. runtime-core 更新的核心流程
136+
5. setup 环境 -> 集成 jest 做单元测试 & 集成 test
137+
6. 实现 effect 返回 runner
138+
7. 实现 effect 的 scheduler 功能
139+
8. 实现 effect 的 stop 功能
140+
9. 实现 readonly 功能
141+
10. 实现 isReactive 和 isReadonly
142+
11. 优化 stop 功能
143+
12. 实现 reactive 和 readonly 嵌套对象转换功能
144+
13. 实现 shallowReadonly 功能
145+
14. 实现 isProxy 功能
146+
15. 实现 isProxy 功能
147+
16. 实现 ref 功能
148+
17. 实现 isRef 和 unRef 功能
149+
18. 实现 proxyR 功能
150+
19. 实现 computed 计算属性功能
151+
20. 实现初始化 component 主流程
152+
21. 实现 rollup 打包
153+
22. 实现初始化 element 主流程
154+
23. 实现组件代理对象
155+
24. 实现 shapeFlags
156+
25. 实现注册事件功能
157+
26. 实现组件 props 功能
158+
27. 实现组件 emit 功能
159+
28. 实现组件 slots 功能
160+
29. 实现 Fragment 和 Text 类型节点
161+
30. 实现 getCurrentInstance
162+
31. 实现依赖注入功能 provide/inject
163+
32. 实现自定义渲染器 custom renderer
164+
33. 更新 element 流程搭建
165+
34. 更新 element 的props
166+
35. 更新 element 的 children
167+
36. 双端对比 diff 算法1
168+
37. 双端对比 diff 算法2 - key 的作用
169+
38. 双端对比 diff 算法3 - 最长子序列的作用
170+
39. 学习尤大解决 bug 的处理方式
171+
40. 实现组件更新功能
172+
41. 实现 nextTick 功能
173+
42. 编译模块概述
174+
43. 实现解析插值功能
175+
44. 实现解析 element 标签
176+
45. 实现解析 text 功能
177+
46. 实现解析三种联合类型 template
178+
47. parse 的实现原理&有限状态机
179+
48. 实现 transform 功能
180+
49. 实现代码生成 string 类型
181+
50. 实现代码生成插值类型
182+
51. 实现代码生成三种联合类型
183+
52. 实现编译 template 成 render 函数
184+
53. 实现 monorepo & 使用 vitest 替换 jest
185+
186+
课程内部包含了 vue3 的三大核心模块:reactivity、runtime 以及 compiler 模块
187+
188+
等你自己手写一遍之后 在去看 vue3 源码或者再去看分析解析 vue3 源码的书籍时你会有不同的体验
189+
190+
除此之外 还录制了课程介绍以及课程试听课
191+
- [课程介绍](https://www.bilibili.com/video/BV16Z4y1r7Wp)
192+
- [试听课](https://www.bilibili.com/video/BV1R341177P7)
193+
- [购买链接](https://cua.h5.xeknow.com/s/xDWLc)
194+
195+
> 可以直接购买 也可以加我 wx: cuixr1314 来咨询这门课是否合适你
196+
197+
除了课程内容以外 还有专门的社群来答疑大家在学习上的问题 😊

0 commit comments

Comments
 (0)