低代码不是噱头，是全栈能力的试金石

很多人对低代码平台的印象还停留在“拖拽生成简陋页面”，但本课程展示的“商业级海报编辑器”彻底颠覆了这一认知。它解决的核心痛点是：开发者如何从零搭建一个具备高自由度、复杂交互和后端支撑的企业级 SaaS 应用。这不仅仅是一个前端项目，而是涵盖了前端低代码引擎、后端 Egg.js+TS 接口服务、Nuxt3 服务端渲染管理后台，以及 Docker 部署和 CI/CD 自动化的完整闭环。

对于希望突破“只会写 CRUD”瓶颈的前端开发，或者想补齐后端与运维视角的全栈学习者来说，这个案例极具含金量。它还原了真实互联网产品从 0 到 1 的落地过程，包括如何处理复杂的状态管理、组件序列化与反序列化、以及多端协同开发中的架构设计问题。学完这门课，你将不再局限于单一的技术栈，而是具备独立构建中小型商业系统的能力。

适合有基础者进阶，资料配合是学习关键

本课程并不适合零基础小白。它要求你至少熟练掌握 JavaScript/TypeScript 基础，并对 Node.js 环境、Vue 或 React 框架、以及基本的 Linux 操作有清晰认知。如果你从未接触过前后端分离开发，直接上手可能会在环境配置和架构理解上遇到困难。适合那些已经掌握单一方向技术，希望通过一个完整项目打通全栈脉络、提升架构思维的中级开发者或准备转岗全栈的转行者。

资料包中包含了完整的项目源码、配置文件及部署脚本。建议的学习策略是“先跑通，再深究”。首先按照课程指引，在本地成功运行前后端及管理服务，感受整个项目的数据流向；然后重点拆解低代码编辑器的核心逻辑，理解字段配置、组件树结构以及如何将其持久化到后端；最后深入 Nuxt3 管理后台，看它如何调用后端接口进行用户与权限管理。不要只看视频，必须亲手修改代码、调试 Bug，才能真正内化这些知识。

学完能独立做什么

完成本课程的实战训练后，你将能够独立设计并实现一个包含可视化配置平台的全栈应用。具体而言，你可以搭建自己的低代码引擎或表单生成器，利用 Nuxt3 构建高性能的管理后台，并熟练运用 Docker 容器化技术和 CI/CD 流水线将项目部署到线上服务器。这种端到端的交付能力，正是目前市场上中高级全栈工程师的核心竞争力。你将不再是被动执行需求的技术工人，而是能够主导技术选型、把控项目架构、并确保产品高质量上线的开发者。

课程目录

├── 第1章 课程简介/ │ └── [ 36M] 1-1课程导学 ├── 第2章 课程设计—需求分析和架构设计：做什么，如何做？/ │ ├── [ 16M] 2-1需求分析-了解软件开发生命周期 │ ├── [ 28M] 2-2宏观需求分析 │ ├── [ 25M] 2-3技术整体架构-几个项目，项目的关系 │ └── [ 46M] 2-4技术整体架构-核心内容分析 ├── 第3章 B端项目需求分析 和 架构设计/ │ ├── [ 14M] 3-1章简介 │ ├── [ 29M] 3-2引子：突破瓶颈，前端破局之路 │ ├── [ 48M] 3-3需求分析 │ ├── [ 45M] 3-4项目难点分析 │ ├── [ 35M] 3-5组件库难点解决方案 │ ├── [ 39M] 3-6编辑器难点解析一 │ ├── [ 53M] 3-7编辑器难点解析二 │ ├── [ 29M] 3-8技术选型-typescript │ ├── [ 46M] 3-9技术选型-vue和react │ └── [ 38M] 3-10总体架构 ├── 第4章 前端基础技术回顾和巡礼/ │ ├── [ 28M] 4-1什么是Typescript为什么要学习它 │ ├── [ 16M] 4-2安装Typescript │ ├── [ 16M] 4-3原始数据类型和Any类型 │ ├── [ 18M] 4-4数组和元组 │ ├── [ 11M] 4-5Interface-接口初探 │ ├── [ 20M] 4-6函数 │ ├── [ 22M] 4-7类型推论联合类型和类型断言 │ ├── [ 21M] 4-8枚举（Enum） │ ├── [ 21M] 4-9泛型（Generics）第一部分 │ ├── [ 20M] 4-10泛型（Generics）第二部分-约束泛型 │ ├── [ 31M] 4-11新泛型第三部分-泛型在类和接口中的使用 │ ├── [ 20M] 4-12类型别名，字面量和交叉类型 │ ├── [ 45M] 4-13声明文件第一部分 │ ├── [ 32M] 4-14声明文件第二部分 │ ├── [ 28M] 4-15内置类型 │ ├── [6.2M] 4-16Vue3学习导学 │ ├── [ 31M] 4-17使用vite创建项目 │ ├── [ 50M] 4-18文件结构以及推荐插件 │ ├── [ 43M] 4-19ESLint简介和初步使用 │ ├── [ 58M] 4-20ESLint配合Vite设置更多规则 │ ├── [ 41M] 4-21响应式基础-Ref和Reactive │ ├── [ 30M] 4-22computed计算属性 │ ├── [ 62M] 4-23watch监听器 │ ├── [ 51M] 4-24生命周期和模版引用 │ ├── [ 54M] 4-25组件基础-属性 │ ├── [ 30M] 4-26组件自定义事件 │ ├── [ 44M] 4-27组合式函数 │ ├── [ 66M] 4-28创建useURLLoader │ ├── [ 34M] 4-29useURLLoader第二部分 │ ├── [ 31M] 4-30setup语法第一部分 │ ├── [ 38M] 4-31setup语法第二部分 │ ├── [ 45M] 4-32依赖注入第一部分 │ ├── [ 33M] 4-33依赖注入第二部分 │ └── [ 47M] 4-34Vue3.3更新简介 ├── 第5章 项目整体搭建/ │ ├── [ 14M] 5-1本章导学 │ ├── [ 37M] 5-2大话前端工具链 │ ├── [ 28M] 5-3使用ImoocCLI创建项目 │ ├── [ 26M] 5-4小花絮：VueCLI对战Vite │ ├── [ 29M] 5-5使用ESLint添加代码规范 │ ├── [ 28M] 5-6深入ESLint配置文件 │ ├── [ 31M] 5-7小花絮：使用Prettier自动格式化代码 │ ├── [ 23M] 5-8项目结构规范 │ ├── [ 35M] 5-9了解GitFlow标准 │ ├── [ 32M] 5-10安装ant-design-vue组件库 │ ├── [ 46M] 5-11使用ant-design-vue搭建页面框架 │ ├── [ 40M] 5-12SPA路由的基本原理 │ ├── [ 29M] 5-13添加配置VueRouter │ ├── [ 42M] 5-14使用VueRouter钩子函数获取路由信息和跳转 │ ├── [ 36M] 5-15(打点区间内字小)使用VueRouter元数据和嵌套路由解决不同模版结构 │ ├── [ 28M] 5-16什么是状态管理工具 │ ├── [ 25M] 5-17Vuex安装和基础使用 │ ├── [ 44M] 5-18Vuex结合整个应用 │ ├── [ 40M] 5-19Vuex添加mutations和getters │ ├── [ 37M] 5-20使用Module分割Vuex模块 │ └── [ 21M] 5-21第九周总结 ├── 第6章 编辑器基本布局，及业务组件库初步开发/ │ ├── [ 16M] 6-1本章导学 │ ├── [ 35M] 6-2将编辑器数据结构添加至vuexstore │ ├── [ 34M] 6-3LText组件初步实现 │ ├── [ 44M] 6-4LText添加通用属性 │ ├── [ 35M] 6-5LText使用hooks重用逻辑 │ ├── [ 39M] 6-6（标记处有什么东西在叫）完成点击模版列表添加到画布的行为 │ ├── [ 22M] 6-7为业务组件属性添加类型的利弊 │ ├── [ 50M] 6-8获取正在编辑的元素的属性 │ ├── [ 51M] 6-9添加属性和表单的基础对应关系并展示 │ ├── [ 28M] 6-10添加更多简单对应关系并展示 │ ├── [ 36M] 6-11添加更多复杂对应关系并展示 │ ├── [ 18M] 6-12分析展示和编辑属性的“金科玉律 │ ├── [ 32M] 6-13添加编辑表单并更新界面第二部分 │ ├── [ 31M] 6-14提出优化需求，以及组件返回的真相 │ ├── [ 28M] 6-15将文本转换为vNode │ ├── [ 42M] 6-16方案一：使用JSX重写PropsTable组件 │ ├── [ 20M] 6-17方案二：使用render函数实现桥梁 │ └── [ 26M] 6-18本周重点内容回顾和总结 ├── 第7章 掌握测试基本工具，给组件库添加单元测试/ │ ├── [8.9M] 7-1本章导学 │ ├── [ 20M] 7-2为什么要有测试 │ ├── [ 26M] 7-3Jest简介 │ ├── [ 27M] 7-4Jest实现异步测试 │ ├── [ 30M] 7-5Jestmock函数测试 │ ├── [ 42M] 7-6Jestmock第三方模块实现 │ ├── [ 31M] 7-7JestmockTimers │ ├── [ 33M] 7-8配置测试开发环境 │ ├── [ 35M] 7-9测试组件：渲染和元素获取 │ ├── [ 52M] 7-10测试组件：触发事件，更新表单，验证事件 │ ├── [ 50M] 7-11测试组件：异步请求 │ ├── [ 34M] 7-12测试通用准备和清理 │ ├── [ 38M] 7-13测试中mock全局组件的实现 │ ├── [ 45M] 7-14模拟第三方库实现的三种”药方“-第一部分 │ ├── [ 38M] 7-15模拟第三方库实现的三种”药方“-第二部分 │ ├── [ 53M] 7-16单独测试Vuexstore │ ├── [ 22M] 7-17什么是TDD的开发方式 │ ├── [ 55M] 7-18TDD第一步：编写测试用例 │ ├── [ 48M] 7-19TDD第二布：编写代码实现 │ ├── [ 19M] 7-20TDD第三步：和应用整合 │ └── [ 22M] 7-21第十一周重点内容回顾和总结 ├── 第8章 通用上传组件开发以及使用/ │ ├── 【更多it资源 www.】 │ ├── [ 13M] 8-1本章导学 │ ├── [ 27M] 8-2上传组件需求分析（加片头） │ ├── [ 48M] 8-3上传文件的原理 │ ├── [ 40M] 8-4万事开头难-编码基本流程 │ ├── [ 50M] 8-5上传基本流程的测试编写 │ ├── [ 51M] 8-6编写上传文件列表功能的测试用例 │ ├── [ 72M] 8-7根据测试实现上传文件列表功能 │ ├── [ 40M] 8-8编写自定义模版功能的测试用例 │ ├── [ 38M] 8-9根据测试完成自定义模版功能 │ ├── [ 68M] 8-10测试驱动开发-完成上传前检查的特性 │ ├── [ 24M] 8-11中期回顾完成情况和新的需求 │ ├── [ 48M] 8-12新的开发方式：添加拖动上传编码 │ ├── [ 52M] 8-13添加拖动上传测试 │ ├── [ 42M] 8-14Vue3世界中的三种实例 │ ├── [ 55M] 8-15Vue3中组件通信的四种方法 │ ├── [ 34M] 8-16ElementPlusUpload组件源码分析第一部分 │ ├── [ 26M] 8-17ElementPlusUpload组件源码分析第二部分 │ ├── [ 42M] 8-18本地图片预览的两种方式 │ ├── [ 38M] 8-19Jest浏览器环境之谜 │ ├── [ 27M] 8-20将上传组件添加到左侧组件列表 │ ├── [ 26M] 8-21上传图片后将图片组件添加到编辑器 │ ├── [ 43M] 8-22扩展知识：Element类型家族之间的关系 │ ├── [ 39M] 8-23通过Image构造函数获取图片的原始大小 │ └── [ 22M] 8-24章总结 ├── 第9章 业务组件库打包、发布，添加 CI&CD/ │ ├── [ 14M] 9-1本章导学 │ ├── [ 25M] 9-2Javascript模块化历史 │ ├── [ 20M] 9-3打包工具的根本作用 │ ├── [ 29M] 9-4Webpack对阵Rollup │ ├── [ 24M] 9-5打包什么类型的模块 │ ├── [ 36M] 9-6花絮-Snowpack另类打包工具简介 │ ├── [ 23M] 9-7创建组件库基本代码结构 │ ├── [ 28M] 9-8Vue插件系统简介 │ ├── [ 20M] 9-9创建入口文件 │ ├── [ 18M] 9-10Rollup配置文件和插件 │ ├── [ 36M] 9-11添加VuePlugin │ ├── [ 41M] 9-12添加TypescriptPlugin │ ├── [ 50M] 9-13尝试打包入口文件 │ ├── [ 25M] 9-14生成两种格式的模块文件 │ ├── [ 40M] 9-15使用npmlink本地测试组件库 │ ├── [ 46M] 9-16分析ElementPlus的打包过程 │ └── [ 46M] 9-17扩展知识-Rollup插件开发的简单原理 ├── 第10章 后端技术选型以及基础知识巩固（上）/ │ ├── [ 32M] 10-2接口分析 │ ├── [ 30M] 10-3后端接口设计文档 │ ├── [ 33M] 10-4技术选型express分析 │ ├── [ 32M] 10-5了解express中间件 │ ├── [ 27M] 10-6调研koa2以及它的基本特点 │ ├── [ 37M] 10-7koa2中间件机制 │ ├── [ 48M] 10-8后端框架选择egg.js │ ├── [ 19M] 10-9egg.js项目结构 │ ├── [ 22M] 10-10Controller第一部分：设置响应 │ ├── [ 31M] 10-11Controller第二部分：获取Request的参数 │ ├── [ 22M] 10-12Postman安装以及使用 │ ├── [ 28M] 10-13Service发送HTTP请求获取信息 │ ├── [ 32M] 10-14Plugin插件的初次接触 │ ├── [ 24M] 10-15Middleware中间件第一部分 │ ├── [ 36M] 10-16Middleware中间件第二部分 │ ├── [ 38M] 10-17Config配置文件第一部 │ ├── [ 28M] 10-18Config配置文件第二部分 │ ├── [ 23M] 10-19Extend扩展第一部分 │ ├── [ 34M] 10-20Extend扩展第二部分 │ ├── [ 48M] 10-21启动自定义 │ ├── [ 42M] 10-22eggtypescript支持的原理 │ ├── [ 51M] 10-23eggjs调试技巧 │ ├── [ 44M] 10-24eggjs日志的概念以及分类 │ ├── [ 24M] 10-25非关系数据库对阵关系型数据库 │ ├── [ 35M] 10-26mongoDB安装第一部分：下载运行 │ ├── [ 21M] 10-27mongoDB安装第二部分：添加到全局命令 │ └── [ 18M] 10-114周导学 ├── 第11章 后端技术选型以及基础知识巩固（下）/ │ ├── [ 31M] 11-1mongod使用配置文件 │ ├── [ 19M] 11-2mongoshell简介及使用 │ ├── [ 19M] 11-3mongoDBGUI软件推荐使用 │ ├── [ 25M] 11-4nodejs连接mongodb数据库 │ ├── [ 41M] 11-5插入和简单查询 │ ├── [ 49M] 11-6mongoDB查询操作符 │ ├── [ 31M] 11-7mongoDB整体结果的处理 │ ├── [ 35M] 11-8更新文档第一部分 │ ├── [ 32M] 11-9更新文档第二部分：更新数组内容 │ ├── [ 24M] 11-10按照数组内容查询并更新 │ ├── [ 42M] 11-11mongoDBNodejs语法小节 … 其余 3

37 项略，目录共 537 项