课程介绍
进阶必学,2023最新 ,打造媲美ElementPlus的组件库视频教程,由整理发布高清完结版。本课程带你使用最新技术栈Vue3.3 + TS4 以及周边最新技术,从0到1完成10+经典组件的设计与开发,1:1 全体系复刻大厂组件库开发全流程,提升架构思维和代码设计能力,进阶成为前端开发高手。
资源目录
1-课程介绍/
[ 14M] 1-1 课程导学
[ 20M] 1-2 代码库使用注意事项
2-Typescript 基础知识/
[ 24M] 2-1 什么是 Typescript 为什么要学习它
[ 13M] 2-2 安装 Typescript
[ 13M] 2-3 原始数据类型和 Any 类型
[ 15M] 2-4 数组和元组
[8.8M] 2-5 Interface- 接口 初探
[ 17M] 2-6 函数
[ 18M] 2-7 类型推论 联合类型和 类型断言
[ 18M] 2-8 枚举(Enum)
[ 18M] 2-9 泛型(Generics) 第一部分
[ 17M] 2-10 泛型(Generics) 第二部分 – 约束泛型
[ 26M] 2-11 泛型第三部分 – 泛型在类和接口中的使用
[ 17M] 2-12 类型别名,字面量 和 交叉类型
[ 40M] 2-13 声明文件 第一部分
[ 27M] 2-14 声明文件 第二部分
[ 25M] 2-15 内置类型
[ 27M] 2-16 配置文件
3- Vue3.0 结合 Typescript 基础知识全面补强/
[5.3M] 3-1 Vue3 学习导学
[ 29M] 3-2 使用 vite 创建项目
[ 46M] 3-3 文件结构以及推荐插件
[ 40M] 3-4 ESLint 简介和初步使用
[ 55M] 3-5 ESLint 配合 Vite 设置更多规则
[ 36M] 3-6 响应式基础 – Ref 和 Reactive
[ 27M] 3-7 computed 计算属性
[ 58M] 3-8 watch 监听器
[ 47M] 3-9 生命周期和模版引用
[ 48M] 3-10 组件基础-属性
[ 27M] 3-11 组件自定义事件
[ 40M] 3-12 组合式函数
[ 61M] 3-13 创建 useURLLoader
[ 30M] 3-14 useURLLoader 第二部分
[ 29M] 3-15 setup语法第一部分
[ 33M] 3-16 setup 语法第二部分
[ 41M] 3-17 依赖注入第一部分
[ 28M] 3-18 依赖注入第二部分
[ 43M] 3-19 Vue3.3更新简介
4-万事开头难 – Button 组件/
[ 19M] 4-1 Button 组件架构设计以及需求分析
[ 20M] 4-2 初始化项目以及项目文件结构
[ 52M] 4-3 Button 组件编码第一部分
[ 34M] 4-4 安装使用 Vue Macros
[ 51M] 4-5 Button编码第二部分
[ 37M] 4-6 选取 CSS 解决方案,现代样式解决方案一览
[ 41M] 4-7 色彩系统:当一次设计师
[ 44M] 4-8 添加色彩变量
[ 34M] 4-9 添加CSS Reset
[ 70M] 4-10 为 Button 添加样式
[ 76M] 4-11 使用 PostCSS 生成对应的CSS 颜色变量
[ 21M] 4-12 Button 章节总结
5-更近一步 Collapse 组件/
[ 34M] 5-1 Collapse 组件架构设计以及需求分析
[ 43M] 5-2 Collapse 编码第一部分 基础编码
[ 43M] 5-3 Collapse 编码第二部分 – 使用 Context 完成父子属性传递
[ 51M] 5-4 Collapse 编码第三部分支持 v-model
[ 55M] 5-5 Collapse 添加样式以及原生 Transition 组件
[ 31M] 5-6 Collapse 添加下拉动画 – 动态计算高度(难点)
[ 23M] 5-7 Collapse 添加动画第二部分 – 尽善尽美
[ 13M] 5-8 Collapse 组件总结
6-它山之石 – Icon 组件/
[ 39M] 6-1 图标库发展历程简介以及 Fontawesome 的安装使用
[ 45M] 6-2 Icon 组件编码第一部分 – 基本实现
[ 38M] 6-3 Icon 组件编码第一部分 – 完善功能以及样式添加
[ 51M] 6-4 看看怎么样 – 为 Button 以及 Collapse 添加图标
[ 26M] 6-5 Icon组件总结
7-组件测试/
[ 19M] 7-1 为什么要有测试
[ 31M] 7-2 简介 Vitest 以及使用
[ 63M] 7-3 学习回调测试以及模拟第三方库实现
[ 24M] 7-4 安装 vue-test-utils 并且使用
[ 33M] 7-5 Button 测试用例第二部分
[ 38M] 7-6 Button 测试第三部分:学习使用 stub
[ 31M] 7-7 学习 VNode 定义以及 Render Function
[ 31M] 7-8 使用 Render Function 写组件以及了解JSX
[ 60M] 7-9 为 Collapse 添加测试用例
[ 26M] 7-10 测试Collapse 事件的第一种方式
[ 45M] 7-11 添加 Collapse 组件的事件测试 第二部分
[ 52M] 7-12 整理测试用例
[ 19M] 7-13 测试总结
8-通用组件 -Tooltip 组件/
[认准一手完整 www.ukoou.com]Vue3.3 + TS4
[ 16M] 8-1 Tooltip 组件需求分析
[ 47M] 8-2 安装并试用 Popper.js
[ 51M] 8-3 Tooltip 编码第一部分 – 实现基本功能
[ 55M] 8-4 Tooltip 编码第二部分 – 支持动态事件
[ 30M] 8-5 Tooltip编码第三部分 – 实现外侧点击关闭
[ 41M] 8-6 Tooltip 编码第四部分 – 实现手动打开关闭
[ 42M] 8-7 Tooltip 编码第五部分 – 添加 popper 参数以及动画效果
[ 44M] 8-8 Tooltip 编码第六部分 – 实现延时显示隐藏功能
[ 45M] 8-9 给 Tooltip 组件添加样式
[ 61M] 8-10 给 Tooltip 组件添加测试
[ 19M] 8-11 Tooltip 组件总结
评论0