mksz449 - 022全面升级！Vue3 + TS 仿知乎专栏企业级项目 - 优百课栈

上传

点击文件名下载附件

【课程目录】

- 第1章课程介绍试看2 节 | 18分钟
  本章节介绍整个课程的内容，让大家了解课程的核心和安排。
  [url=]收起列表[/url]
  - 视频：1-1 课程介绍（导学） (13:24)试看
  - 视频：1-2 代码库和在线文档使用注意事项（必看） (03:53)
- 第2章你好 Typescript：进入类型的世界20 节 | 131分钟
  本章主要帮助大家理解 TypeScript 可以解决的问题和所带来的优势，带领大家学习 TS 中的各种基础类型，然后进阶到复杂类型，包括：Array, Tuple, interface, function, Class, Enum, Generices等，迅速帮助大家理解 TS 的基础使用方式和语法。
  [url=]收起列表[/url]
  - 视频：2-1 什么是 Typescript (05:54)
  - 图文：2-2 安装 Typescript 文档
  - 视频：2-3 为什么要学习 typescript (06:04)
  - 视频：2-4 安装 typescript (05:59)
  - 视频：2-5 原始数据类型和 Any 类型 (06:04)
  - 视频：2-6 数组和元组 (06:52)
  - 视频：2-7 Interface- 接口初探 (05:40)
  - 视频：2-8 函数 (06:52)
  - 视频：2-9 类型推论联合类型和类型断言 (07:43)
  - 视频：2-10 枚举（Enum） (07:11)
  - 视频：2-11 泛型（Generics）第一部分 (07:28)
  - 视频：2-12 泛型（Generics）第二部分 - 约束泛型 (06:07)
  - 视频：2-13 泛型第三部分 - 泛型在类和接口中的使用 (08:47)
  - 视频：2-14 类型别名，字面量和交叉类型 (07:12)
  - 视频：2-15 声明文件第一部分 (13:22)
  - 视频：2-16 声明文件第二部分 (10:31)
  - 视频：2-17 内置类型 (08:33)
  - 视频：2-18 配置文件 (10:31)
  - 作业：2-19 【讨论题】对 Typescript 初步学习后的印象和困惑
  - 作业：2-20 为 clipboard.js 开源库添加简化版的定义文件
- 第3章初识 Vue3.0：新特性详解试看27 节 | 189分钟
  首先浏览 vue3 新带来的变化，然后从为什么会有 vue3 引出话题，带领大家学习 compostion API，自定义Hooks，Teleport，Suspense 和全局 API 修改等一系列 vue3 的重大更新。
  [url=]收起列表[/url]
  - 视频：3-1 vue3 新特性巡礼 (04:45)
  - 视频：3-2 为什么会有 vue3 (07:09)
  - 视频：3-3 使用 vue-cli 配置 vue3 开发环境 (08:42)
  - 视频：3-4 使用 vite 创建项目 (06:36)
  - 视频：3-5 代码结构分析以及推荐插件安装 (11:11)
  - 视频：3-6 使用 eslint 规范代码 (11:20)
  - 视频：3-7 vue3 - ref 的妙用 (08:20)试看
  - 视频：3-8 更近一步 - reactive (10:14)
  - 视频：3-9 vue3 响应式对象的新花样 (06:51)
  - 视频：3-10 老瓶新酒 - 生命周期 (07:00)
  - 视频：3-11 侦测变化 - watch (07:16)
  - 视频：3-12 vue3 模块化妙用- 鼠标追踪器 (09:04)
  - 视频：3-13 模块化难度上升 - useURLLoader (09:40)
  - 视频：3-14 模块化结合typescript - 泛型改造 (08:28)
  - 图文：3-15 新版 axios 出现 “unknown” 错误的解决方案
  - 视频：3-16 Typescript 对 vue3 的加持 (05:48)
  - 视频：3-17 Teleport - 瞬间移动第一部分 (05:47)
  - 视频：3-18 Teleport - 瞬间移动第二部分 (09:16)
  - 视频：3-19 Suspense - 异步请求好帮手第一部分 (05:10)
  - 视频：3-20 Suspense - 异步请求好帮手第二部分 (06:31)
  - 视频：3-21 Provide - Inject (11:31)
  - 视频：3-22 全局 API 修改 (07:13)
  - 视频：3-23 setup 语法糖基础 (07:33)
  - 视频：3-24 setup 语法糖进阶- (12:51)
  - 作业：3-25 【谈一谈】经过新特性的学习
  - 作业：3-26 【讨论题】你对 vue3 的 composition API
  - 作业：3-27 【学习任务】写一个 hooks 函数，来监听键盘的按键
- 第4章项目起航 - 准备工作和第一个页面12 节 | 96分钟
  本章从项目的需求开始分析，然后确定项目的整体结构和代码规范，并且为项目选择 Bootstrap 作为样式库，编写 ColumnList 和 GlobalHeader 完成简单的练手以后，开始挑战第一个比较复杂的 Dropdown 下拉菜单组件，最后还抽象抽象出第一个 hooks 函数。...
  [url=]收起列表[/url]
  - 视频：4-1 项目起航需求分析 (10:42)
  - 视频：4-2 文件结构和代码规范 (09:20)
  - 视频：4-3 样式解决方案简介和分析 (07:37)
  - 视频：4-4 设计图拆分和组件属性分析 (05:31)
  - 视频：4-5 ColumnList 组件编码 (10:58)
  - 视频：4-6 ColumnList 组件使用 Bootstrap 美化 (09:56)
  - 视频：4-7 GlobalHeader 组件编码 (08:29)
  - 视频：4-8 Dropdown 组件基本功能编码 (08:41)
  - 视频：4-9 Dropdown 组件添加 DropdownItem (08:16)
  - 视频：4-10 Dropdown 组件点击外部区域自动隐藏 (08:35)
  - 视频：4-11 useClickOutside 第一个自定义函数 (07:27)
  - 作业：4-12 【讨论题】谈谈你在工作中常用的样式解决方案？
- 第5章表单的世界 - 完成自定义 Form 组件试看13 节 | 81分钟
  本章来到表单的世界，从头到尾非常完整的完成了一个带验证表单组件的全流程开发过程，在整个过程中，我们还学习到了 v-model，$attrs, slot，组件父子通讯和 mitt 的各种知识点。
  [url=]收起列表[/url]
  - 视频：5-1 web 世界的经典元素 - 表单 (04:56)
  - 视频：5-2 ValidateInput 第一部分 — 简单的实现 (08:28)试看
  - 视频：5-3 ValidateInput 第二部分 —抽象验证规则 (12:38)
  - 视频：5-4 ValidateInput 第三部分 — 支持 v-model (11:57)
  - 视频：5-5 ValidateInput 编码第四部分 — 使用 $attrs 支持默认属性 (07:35)
  - 作业：5-6 【讨论题】谈谈扩展 ValidateInput 的验证功能
  - 视频：5-7 ValidateForm 组件需求分析 (04:21)
  - 视频：5-8 ValidateForm 编码第一部分 - 使用插槽 slot (09:17)
  - 视频：5-9 ValidateForm 编码第二部分 - 尝试父子通讯 (08:09)
  - 视频：5-10 ValidateForm 编码第三部分 - 寻找外援 mitt (05:49)
  - 图文：5-11 使用新版 mitt 时报出类型错误的解决方案
  - 视频：5-12 ValidateForm 编码第四部分 - 大功告成 (07:27)
  - 作业：5-13 学习任务：扩展ValidateForm的功能，完成清空功能
- 第6章请你吃全家桶 - 初步使用 vue-router 和 vuex15 节 | 103分钟
  本章从 SPA 的概念引出，完成了 vue-router 的安装，然后学习它的基本使用，获取信息，动态跳转，前置守卫和元信息等各种知识点，然后又介绍了状态管理工具的具体定义，从而引出 vuex 的安装和它的 state，mutation，getter 等多个基本知识点。...
  [url=]收起列表[/url]
  - 视频：6-1 什么是 SPA（Single Page Application）应用？ (06:54)
  - 视频：6-2 添加路由页面基础结构 (06:30)
  - 图文：6-3 添加路由页面基础结构代码地址
  - 视频：6-4 vue-router 安装和使用 (05:24)
  - 视频：6-5 vue-router 配置路由 (07:14)
  - 视频：6-6 vue-router 添加路由 (11:39)
  - 视频：6-7 添加 columnDetail页面 (08:02)
  - 视频：6-8 状态管理工具是什么 (06:55)
  - 图文：6-9 ColumnDetail 代码提交详情
  - 视频：6-10 Vuex 简介和安装 (08:17)
  - 视频：6-11 Vuex 整合当前应用 (12:26)
  - 视频：6-12 使用 Vuex getters (05:52)
  - 视频：6-13 添加新建文章页面 (10:03)
  - 视频：6-14 Vue router 添加路由守卫 - 前置守卫 (07:56)
  - 视频：6-15 Vue router 添加路由守卫 - 使用元信息完成权限管理 (05:39)
- 第7章前后端结合 - 项目整合后端接口12 节 | 88分钟
  本章从前后端分离和 RESTful 概念入手，介绍了为学生提供的 swagger 调试工具如何使用，然后引入 axios，通过 vuex action 的添加，实现 async 改造和 axios 拦截器的基本用法，最后还抽象出一个 Loader 组件的编码和实现过程。
  [url=]收起列表[/url]
  - 视频：7-1 前后端分离开发是什么 (07:29)
  - 视频：7-2 RESTful API 设计理念 (10:01)
  - 视频：7-3 使用 swagger在线文档查看接口详情 (10:43)
  - 视频：7-4 axios 的基本用法和独家后端API 使用（必看） (09:00)
  - 图文：7-5 后端Icode终极使用方案
  - 视频：7-6 使用vuex action 发送异步请求 (11:17)
  - 视频：7-7 使用vuex action 发送异步请求第二部分 (08:23)
  - 图文：7-8 CreatePost 页面 ColumnId 类型报错的解决方案
  - 视频：7-9 使用 async 和 await 改造异步请求 (08:22)
  - 视频：7-10 使用axios拦截器添加loading效果 (07:19)
  - 视频：7-11 Loader 组件编码第一部分 - 基本实现 (08:42)
  - 视频：7-12 Loader 组件编码第二部分 - 使用 Teleport 进行改造 (06:38)
- 第8章通行凭证 - 权限管理12 节 | 100分钟
  本章从获取 token 为起点，讲述了 JWT 通用身份验证工具的原理和实现，然后完成了 axios 设置通用header 和持久化登录的处理方法，之后还添加了全局通用错误处理，最后抽象出一个通用组件 Message 的编码和实现过程。
  [url=]收起列表[/url]
  - 视频：8-1 登录第一部分获取token (08:09)
  - 视频：8-2 jwt 的运行机制 (09:00)
  - 视频：8-3 登录第二部分 axios 设置通用 header (10:08)
  - 视频：8-4 登录第三部分持久化登录状态 (07:47)
  - 视频：8-5 通用错误处理 (07:00)
  - 视频：8-6 创建 Message 组件 (10:02)
  - 视频：8-7 Message 组件改进为函数调用形式 (11:05)
  - 视频：8-8 了解 Vnode 以及 vue 的简单工作原理 (10:17)
  - 视频：8-9 创建 Vnode 以及使用 render function (10:23)
  - 视频：8-10 使用 h 函数改造 message 组件 (06:54)
  - 视频：8-11 作业：注册页面的编写 (09:06)
  - 作业：8-12 【学习任务】完成注册页面的功能
- 第9章道高一尺 - 上传组件10 节 | 95分钟
  本章实现了 Upload 组件从分析，编码的全过程，在这个过程中，我们将会学到：上传文件的原理，使用 axios 完成文件上传的方法，循序渐进的完成一个复杂组件的开发流程。
  [url=]收起列表[/url]
  - 视频：9-1 上传组件需求分析 (06:38)
  - 视频：9-2 上传文件的两种实现方式 (10:32)
  - 视频：9-3 (打点时间) Uploader 组件第一部分 (12:50)
  - 视频：9-4 Uploader 组件第二部分 (10:12)
  - 视频：9-5 Uploader 组件第三部分：自定义模版 (08:17)
  - 视频：9-6 改进路由验证系统 (09:26)
  - 视频：9-7 创建文章页面实现 Uploader 自定义样式 (11:15)
  - 视频：9-8 大功告成创建文章最后流程 (15:49)
  - 视频：9-9 作业完成文章详情页 (09:42)
  - 作业：9-10 【学习任务】完成文章详情页的编码
- 第10章最终的功能 - 编辑和删除文章10 节 | 112分钟
  通过完成文章的编辑和删除功能，引出了之前组件留下的几个 bug，通过解决bug 带给大家持续优化的思路和方案，最后完成了一个通用 Modal 组件的编码过程。
  [url=]收起列表[/url]
  - 视频：10-1 添加编辑和删除区域 (09:18)
  - 视频：10-2 修改文章编码第一部分 - 改进 Uploader 组件 (09:48)
  - 视频：10-3 修改文章编码第二部分 - 改进 ValidateInput 组件 (08:49)
  - 视频：10-4 修改文章编码第三部分 - 完成编辑功能 (10:52)
  - 视频：10-5 Modal组件编码 (10:56)
  - 视频：10-6 完成删除文章功能 (08:00)
  - 视频：10-7 集成 Easymde 编辑器第一部分：简介，初步安装和使用 (11:43)
  - 视频：10-8 集成 Easymde 编辑器第二部分：初步组件化- (19:34)
  - 视频：10-9 集成 Easymde 编辑器第三部分：暴露方法 (08:50)
  - 视频：10-10 集成 Easymde 编辑器第四部分：结合页面完成功能 (13:32)
- 第11章持续优化11 节 | 83分钟
  通过分析发现应用中可以优化的两个部分，提出并编码数组改成对象的store 优化方案以及防止重复请求的解决方案。最后还抽象除了 useLoadMore 的逻辑实现，最终完成了一个复杂的自定义 Hooks。
  [url=]收起列表[/url]
  - 视频：11-1 可以优化的两个点 (07:50)
  - 视频：11-2 完成帮助函数 (09:58)
  - 视频：11-3 将 store 中的数组转换成对象 (08:25)
  - 视频：11-4 防止重复请求逻辑分析 (05:30)
  - 视频：11-5 缓存优化第一部分 (09:33)
  - 视频：11-6 缓存优化第二部分 (06:46)
  - 视频：11-7 useLoadMore 实现分析 (06:22)
  - 视频：11-8 useLoadMore 编码 (07:22)
  - 视频：11-9 useLoadMore 在首页实践 (10:35)
  - 视频：11-10 useLoadMore 支持数据缓存解决方案分析 (04:57)
  - 视频：11-11 实现分页缓存逻辑 (05:30)
- 第12章项目构建和部署10 节 | 70分钟
  从生产环境的概念以及生产环境和开发环境的异同的概念开始，接着实践了应用构建，构建代码上线，和构建代码持续集成的一系列概念。
  [url=]收起列表[/url]
  - 视频：12-1 生产环境和开发环境的异同 (06:23)
  - 视频：12-2 为生产环境生成代码 (07:48)
  - 视频：12-3 使用 vite 构建代码 (10:45)
  - 视频：12-4 vite 对阵 vue-cli：为什么快？ (07:06)
  - 视频：12-5 服务器的概念 (06:06)
  - 视频：12-6 nginx 概念简介 (07:25)
  - 视频：12-7 使用 gitee pages 进行部署 (04:38)
  - 视频：12-8 nginx安装和配置访问静态文件 (05:35)
  - 视频：12-9 nginx 配置代理服务 (07:07)
  - 视频：12-10 上传代码到云主机 (06:22)
- 第13章课程总结1 节 | 6分钟
  本章节带领大家回顾课程的内容。
  [url=]收起列表[/url]
  - 视频：13-1 课程总结 (05:57)

作者: 15523053981 时间: 2021-1-22 14:28
汪汪汪汪汪汪汪汪汪汪汪汪汪汪汪汪

作者: dabaicai 时间: 2021-2-3 23:05
测试测试测试测试测试测试测试测试测试测试测试测试测试测试

作者: jjb 时间: 2021-2-28 20:30
TS 仿知乎专栏企

作者: phj666 时间: 2021-3-5 14:03
1111111111111111111111111111

作者: 股基大涨 时间: 2021-3-13 23:28
好哈反对法地方

作者: pcsms_YXh8Vk8R 时间: 2021-5-11 14:26
Vue3.0 +TS ，使用新版Vuex 和 Vue-Router 全家桶

作者: Zzhiren 时间: 2021-5-11 23:03
厉害厉害厉害厉害厉害厉害厉害厉害厉害厉害

作者: user998 时间: 2021-6-21 22:05
Vue3.0（正式版） + TS 仿知乎专栏企业级项目

作者: wally 时间: 2021-7-14 10:18
Vue3.0（正式版） + TS 仿知乎专栏

作者: hmz 时间: 2021-8-1 17:16
RE: mksz449 - Vue3.0（正式版） + TS 仿知乎专栏企业级项目 [修改]

作者: ricker 时间: 2021-10-14 16:48
6666666666666666666666666

作者: Bob1270 时间: 2021-10-28 16:56
表单表单，怎么能缺少表单校验呢？可以说我们之所以讲解表单组件，并把上面的组件归类为表单组件，最大的一个原因就是我们需要对这些组件的交互结果进行校验，所以自古以来，组件库对于表单校验功能的要求都是空前高的。在课程中我们会实现一套完整的表单校验功能，甚至不必开源组件诸如element-ui之类的差，这简直可以成为...

作者: 小草 时间: 2021-11-6 22:52
资源不错

作者: pcsms_ei4tg1SH 时间: 2021-12-7 14:25
mksz449 - Vue3.0（正式版） + TS 仿知乎专栏企业级项目[

作者: yhysir 时间: 2021-12-9 16:00
1111111111111111

作者: carson9246 时间: 2022-4-5 17:11
嘻嘻嘻嘻嘻嘻嘻

作者: 落叶无声xcm 时间: 2022-8-28 23:39
哈哈哈哈

欢迎光临优百课栈 (https://www.ubkz.com/)