Vue3+ElementPlus+Koa2 全栈开发后台系统
从前端晋级到全栈，让你的未来发展有更多可能
现如今前端的边界在持续扩大，企业对于工具化、平台化、全栈化能力要求也越来越高。本课程将应用Vite2.0 + Vue3 + ElementPlus+Koa2+Mongo开发一个通用后台管理系统，带大家掌握全栈开发能力，及真正落地的综合技术能力。
技术要求
1. 熟悉HTML、 CSS和JavaScript编程
2.有了一定Vue基础和Vue的实际开发经验
3.已经具备Node.js、npm的使用经验
环境参数
脚手架：@vue/cli 4.5.9 ；全家桶：vue@3.0.5；vue-router@4.0.4；vuex@4.0.0
UI框架：element-plus@1.0.2-beta.32；构建工具：vite 2.0.1 ；css预编译：sass@1.32.8
[wm_tips]试看链接：https://pan.baidu.com/s/1HCnt1cjXEf8Pa_-C8k1Abg
提取码：e9wf
[/wm_tips]
章节目录：
-
第1章 项目规划 试看9 节 | 74分钟
本章将向大家介绍，一个常规项目在团队内的开发流程、成员分工以及如何理解通用后台，最后会给大家讲解Vue3核心知识点，带你做好储备。
- 视频：1-1 课前须知，这里有你需要了解得一切 (13:00)试看
- 视频：1-2 项目开发流程 (17:55)
- 作业：1-3 【讨论题】你了解到的开发流程都有哪些？
- 视频：1-4 如何理解通用后台 (11:33)
- 视频：1-5 需求介绍 (13:17)
- 视频：1-6 Vue3直通车 (17:19)
- 图文：1-7 【拓展知识】Vue3和Vue2语法差异？
- 作业：1-8 【讨论题】Vue3你目前学会了哪些语法？
- 图文：1-9 【知识点梳理】本章重难点总结
-
第2章 前端架构设计 试看14 节 | 145分钟
本章将向大家介绍，如何从0搭建标准的前端架构设计。会基于vite2.0构建，使用最新版本脚手架，同时也会涉及，项目构建时目录规范、路由封装、环境配置、axios高复用、主页结构布局等。
- 视频：2-1 项目初始化–全局Vue脚手架&Vite创建项目 (16:41)
- 视频：2-2 项目初始化–插件安装 (06:03)
- 视频：2-3 目录结构规范 (11:45)
- 视频：2-4 路由封装（上） (16:16)试看
- 视频：2-5 路由封装（下） (07:04)
- 视频：2-6 环境配置 (16:25)
- 视频：2-7 axios二次封装（上） (15:11)
- 视频：2-8 axios二次封装（下） (12:29)
- 视频：2-9 storage二次封装 (20:02)
- 视频：2-10 主页结构布局 (22:15)
- 图文：2-11 【延伸阅读】架构师需要考虑哪些环节？
- 作业：2-12 【讨论题】你接触到的前端架构设计包括哪些？
- 图文：2-13 【知识点梳理】本章重难点总结–环境配置&目录规范
- 图文：2-14 【知识点梳理】本章重难点总结–路由封装
-
第3章 Koa架构设计18 节 | 100分钟
本章将带领大家完成，如何从0构建标准的Koa2项目。包含：Koa2初始化、项⽬分析、Mongo安装配置、Mongo语法讲解、接口文档设计、日志规范、工具函数封装等。
- 图文：3-1 【资料梳理】Koa2项目初始化操作
- 视频：3-2 项目结构分析 (11:29)
- 视频：3-3 应用log4js进行日志规范封装（上） (05:16)
- 视频：3-4 应用log4js进行日志规范封装（下） (22:02)
- 视频：3-5 Window下Mongo安装和配置 (13:20)
- 视频：3-6 Mac下Mongo安装和配置 (05:51)
- 图文：3-7 【资料梳理】Windows下Mongo安装配置
- 视频：3-8 Mongo基础入门 (12:28)
- 图文：3-9 【资料梳理】数据库表结构
- 视频：3-10 接口文档设计 (20:53)
- 图文：3-11 【资料梳理】接口文档—用户管理
- 图文：3-12 【资料梳理】接口文档—菜单管理
- 图文：3-13 【资料梳理】接口文档—部门管理
- 图文：3-14 【资料梳理】接口文档—角色管理
- 图文：3-15 【资料梳理】接口文档—审批管理
- 视频：3-16 工具函数封装 (08:11)
- 图文：3-17 【资料梳理】Mac下Mongo安装配置
- 作业：3-18 【讨论题】Koa你掌握了多少？
-
第4章 用户登录前后台实现5 节 | 59分钟
本章将带领大家一起来实现完整登录功能，包含前端、后台和联调实现。
- 视频：4-1 登录布局开发 (13:36)
- 视频：4-2 登录交互开发 (20:02)
- 视频：4-3 用户登录后台实现 (24:38)
- 图文：4-4 【延伸阅读】登录需要掌握知识点？
- 作业：4-5 【讨论题】你了解的开发流程是什么？
-
第5章 前台首页实现9 节 | 81分钟
本章中，我们一起来实现首页完整的功能。包含欢迎页面布局实现、侧边栏菜单功能、菜单递归算法、面包屑导航实现等等。
- 视频：5-1 欢迎页面实现 (10:36)
- 视频：5-2 首页菜单功能实现（上） (13:26)
- 视频：5-3 首页菜单功能实现（下） (15:20)
- 视频：5-4 菜单交互及递归实现（上） (11:56)
- 视频：5-5 菜单交互及递归实现（下） (10:33)
- 视频：5-6 面包屑实现 (12:54)
- 视频：5-7 知识补充 (05:41)
- 图文：5-8 【知识点梳理】本章重难点总结
- 作业：5-9 【讨论题】手写一个递归算法？
-
第6章 JWT方案讲解 试看6 节 | 50分钟
本章将向大家介绍何为JWT，以及结合本项目JWT的整体实现和设计方案。
- 视频：6-1 JWT理论介绍 (10:27)试看
- 视频：6-2 通过jwt生成token (19:39)
- 视频：6-3 Token拦截 (19:49)
- 图文：6-4 【知识拓展】传统登录做法是如何记住用户身份信息
- 图文：6-5 【知识点梳理】本章重难点总结
- 作业：6-6 【讨论题】JWT包含哪些知识点？
-
第7章 用户管理前后端实现14 节 | 216分钟
本章将带领大家一起完成用户管理模块功能。包含：用户管理静态布局、交互，列表、删除/批量删除、新增、编辑等前后端功能实现，同时做好前后端接⼝联调。
- 视频：7-1 用户管理列表实现（上） (14:52)
- 视频：7-2 用户管理列表实现（下） (16:11)
- 视频：7-3 用户列表交互实现 (20:56)
- 视频：7-4 用户删除和批量删除 (19:38)
- 视频：7-5 用户新增实现 (26:12)
- 视频：7-6 用户新增交互实现 (30:52)
- 视频：7-7 用户编辑交互实现 (07:45)
- 视频：7-8 用户列表接口实现&联调 (32:47)
- 视频：7-9 用户删除接口实现&联调 (15:38)
- 视频：7-10 用户编辑接口实现&联调 (11:40)
- 视频：7-11 用户新增接口实现 (19:29)
- 图文：7-12 【知识点梳理】本章重难点总结
- 图文：7-13 【知识拓展】用户模块理解
- 作业：7-14 【讨论题】用户管理模块你掌握了哪些内容？
-
第8章 菜单模块前后端实现9 节 | 117分钟
本章中，我们一起来完成菜单模块前后端逻辑实现。包含菜单树结构组装、菜单列表、删除、新增、编辑功能前后端实现。
- 视频：8-1 菜单列表实现 (25:06)
- 视频：8-2 菜单新增实现（上） (15:40)
- 视频：8-3 菜单新增实现（下） (15:44)
- 视频：8-4 菜单编辑&删除实现 (09:02)
- 视频：8-5 菜单编辑、删除、创建服务端实现 (22:19)
- 视频：8-6 菜单列表递归实现（上） (13:32)
- 视频：8-7 菜单列表递归实现（下） (14:59)
- 图文：8-8 【知识点梳理】本章重难点总结
- 作业：8-9 【讨论题】菜单模块你掌握了哪些知识点？
-
第9章 ⻆色管理前后端实现11 节 | 127分钟
本章中，我们将一起来完成⻆色管理模块前后端逻辑实现。包含：⻆色新建、编辑、删除、权限设置、权限点遍历等功能。
- 视频：9-1 角色列表实现 (19:09)
- 视频：9-2 角色操作（创建、编辑、删除） (17:31)
- 视频：9-3 权限设置（上） (13:35)
- 视频：9-4 权限设置（下） (15:07)
- 视频：9-5 权限列表递归处理 (13:53)
- 视频：9-6 角色列表后台实现 (23:10)
- 视频：9-7 角色创建、编辑、删除后台实现 (14:38)
- 视频：9-8 角色列表权限展示实现 (09:05)
- 图文：9-9 【知识点梳理】本章重难点总结
- 图文：9-10 【知识拓展】认识权限
- 作业：9-11 【讨论题】权限设置需要注意什么？
-
第10章 部门管理前后端实现7 节 | 78分钟
本章中，我们一起来完成部门管理模块前后端逻辑实现。包含：部门新建、编辑、删除等功能。
- 视频：10-1 部门列表实现 (14:21)
- 视频：10-2 部门创建、编辑删除实现（上） (16:06)
- 视频：10-3 部门创建、编辑删除实现（下） (14:55)
- 视频：10-4 部门创建、编辑、删除后台实现 (21:27)
- 视频：10-5 部门列表递归实现 (10:57)
- 图文：10-6 【知识点梳理】本章重难点总结
- 作业：10-7 【讨论题】本章包含了哪些功能点？
-
第11章 动态路由、导航守卫、按钮权限&工作流介绍10 节 | 108分钟
本章中，将向大家介绍行业内常用的工作流形态以及本次课程所涉及到的审批流，工作流实现时需要掌握的理论知识、相关概念等，引导大家有一个全面的认识。
- 视频：11-1 权限&工作流介绍 (12:06)
- 视频：11-2 动态菜单渲染实现（上） (16:35)
- 视频：11-3 动态菜单渲染实现（下） (14:04)
- 视频：11-4 按钮权限控制实现 (24:37)
- 视频：11-5 404页面开发 (08:20)
- 视频：11-6 导航守卫 (07:40)
- 视频：11-7 动态路由 (17:11)
- 视频：11-8 章节总结 (06:50)
- 图文：11-9 【知识点梳理】本章重难点总结
- 作业：11-10 【讨论题】分解一下动态路由和按钮权限实现过程？
-
第12章 休假申请前后端实现11 节 | 125分钟
本章中，我们一起来完成休假申请模块前后端逻辑实现，并会结合部门管理菜单，设计一套标准的审批流。
- 视频：12-1 休假申请列表实现（上） (16:11)
- 视频：12-2 休假申请列表实现（下） (16:57)
- 视频：12-3 创建 – 申请休假（上） (15:33)
- 视频：12-4 创建 – 申请休假（下） (16:35)
- 视频：12-5 休假详情&作废（上） (11:50)
- 视频：12-6 休假详情&作废（下） (11:04)
- 视频：12-7 后台列表实现 (14:43)
- 视频：12-8 创建申请单后台实现（上） (13:38)
- 视频：12-9 创建申请单后台实现（下） (08:23)
- 图文：12-10 【知识点梳理】本章重难点总结
- 作业：12-11 【讨论题】什么是工作流以及审批流实现思路？
-
第13章 待我审批前后端实现7 节 | 74分钟
在这一章中，我们一起来完成待审批模块前后端逻辑实现，并结合部门管理菜单，实现标准的审核功能。
- 视频：13-1 审核列表前后端实现 (19:06)
- 视频：13-2 审核通过、拒绝功能实现（上） (14:21)
- 视频：13-3 审核通过、拒绝功能实现（中） (13:46)
- 视频：13-4 审核通过、拒绝功能实现（下） (12:04)
- 视频：13-5 待审核通知功能实现 (14:25)
- 图文：13-6 【知识点梳理】本章重难点总结
- 作业：13-7 【讨论题】你都接触过哪些轮子？谈一谈你对低代码的认识？
-
第14章 造轮子15 节 | 185分钟
项目开发完成后，我们会重点讲解在人力短缺的工作中，如何提效，如何优化重构模块，我们会重点开发脚手架和低代码组件来实现降本增效。
- 视频：14-1 认识造轮子 (11:56)
- 视频：14-2 Commander命令使用 (15:34)
- 视频：14-3 figlet插件使用 (06:23)
- 视频：14-4 inquirer插件使用 (09:05)
- 视频：14-5 ora和download-git-repo插件使用 (07:32)
- 视频：14-6 完整脚手架实现（上） (12:54)
- 视频：14-7 完整脚手架实现（下） (12:04)
- 视频：14-8 v-model实现 (18:11)
- 视频：14-9 QueryForm实现（上） (15:57)
- 视频：14-10 QueryForm实现（中） (13:37)
- 视频：14-11 QueryForm实现（下） (16:14)
- 视频：14-12 BaseTable-基础功能 (17:18)
- 视频：14-13 BaseTable操作列实现 (19:43)
- 视频：14-14 BaseTable-分页联动 (07:37)
- 图文：14-15 【知识点梳理】本章重难点总结
