本章开始接入后端开发,实现作品的预览,保存,自动保存,发布和渠道编辑等一系列功能。
- 17-1 添加编辑器 Header
- 17-2 前后端分离开发简介
- 17-3 分析后端接口和需求
- 17-4 使用 vuex action 发送请求
- 17-5 JSON server 的简介和安装使用
- 17-6 JSON server 自定义接口URL 和 返回数据结构
- 17-7 JSON Server 实现 JWT 验证 - 生成 token
- 17-8 JSON Server 实现 JWT 验证 - 实现路由保护
- 17-9 使用 AForm 完成表单验证
- 17-10 使用 AForm 完成提交时验证的两种方法
- 17-11 完成获取验证码的功能
- 17-12 完成用户登陆过程
- 17-13 使用高阶函数 actionWrapper 包装 action 通用逻辑
- 17-14 AForm 源代码解析 :Form 组件 和 FormItem 完成验证
- 17-15 AForm 源代码解析 :使用 useForm 完成验证
- 17-16 添加全局读取状态 - 整体通用读取状态
- 17-17 添加全局读取状态 - 细粒度读取状态
- 17-18 处理全局错误处理
- 17-19 将全局读取和错误添加至根组件
- 17-20 登陆状态持久化
- 17-21 路由权限验证 第一部分 - 功能分析
- 17-22 路由权限验证 第二部分 - 编码实现
- 17-23 编辑器获取作品 第一部分 - 发送并且改进 action
- 17-24 编辑器获取作品 第二部分 - 根据数据渲染至画布
- 17-25 添加编辑器 Header
- 17-26 保存作品数据
- 17-27 添加自动保存功能
- 17-28 跳转路由前提示保存
- 17-29 提取和整合保存作品逻辑
- 17-30 总结
仅仅掌握一个基础的编译器,可能并不能满足大家的胃口。所以在本章中,我们将深入编译器逻辑,从响应性处理、多层渲染、指令这三个方面入手,帮助大家深入编译器逻辑。
- 15-1 前言
- 15-2 响应性数据的编辑器处理:响应性数据的处理逻辑
- 15-3 响应性数据的编辑器处理:AST 解析逻辑
- 15-4 响应性数据的编辑器处理:JavaScript AST 转化逻辑
- 15-5 响应性数据的编辑器处理:render 转化逻辑分析
- 15-6 响应性数据的编辑器处理:generate 生成 render 函数
- 15-7 响应性数据的编辑器处理:render 函数的执行处理
- 15-8 多层级模板的编辑器处理:多层级的处理逻辑
- 15-9 基于编辑器的指令(v-xx)处理:指令解析的整体逻辑
- 15-10 困难-基于编辑器的指令(v-xx)处理:AST 解析逻辑
- 15-11 困难-基于编辑器的指令(v-xx)处理:JavaScript AST ,构建 vif 转化模块
- 15-12 基于编辑器的指令(v-xx)处理:JavaScript AST ,transform 的转化逻辑
- 15-13 基于编辑器的指令(v-xx)处理:生成 render 函数
- 15-14 总结
本章通过从前端构建可拖拽的组件列表,所见即所得的页面布局编辑器和区块属性和数据表单等逐渐梳理清楚需要的 API,处理复杂的页面区块的增删改等操作。同时深入了解了级联操作,前端如何设计现代的路由等知识。
- 9-1 前端图片数据列表界面和编辑弹出界面
- 9-2 重定向,子路由,嵌套路由
- 9-3 作业布置:实现运营管理后台前端界面的路由和布局
- 9-4 作业回顾:实现运营管理后台前端界面的路由和布局
- 9-5 前端 Flutter 拖拽初步,child, feedback 和 childWhenDragging
- 9-6 拖放目标 DragTarget 和拖拽的数据处理
- 9-7 重构设计界面,对 DragTarget 组件的进一步了解
- 9-8 前端实现移动区块顺序,确定保存的逻辑
- 9-9 添加区块工具栏,规划事件,重构确认对话框
- 9-10 完成前端区块配置表单的布局和样式
- 9-11 重置表单,新建数据表单的初步结构
- 9-12 前端图片数据列表界面和编辑弹出界面
- 9-13 图片编辑界面集成图片管理的功能
- 9-14 根据前端需求修改后端模型,重构区块的数据结构
- 9-15 移动区块排序 API 的实现
- 9-16 重构区块排序逻辑,添加数据排序接口
- 9-17 重构区块 API,分离添加和更新的VM,重新认识级联关系
- 9-18 作业布置:完成画布页面的添加,修改和删除图片区块和图片区块数据
- 9-19 作业回顾:完成画布页面中添加,修改和删除图片区块和图片区块数据
- 9-20 完成区块配置表单的事件处理,修复 title 的类型转换问题
- 9-21 使用函数层层剥离,重构区块列表组件(上)
- 9-22 使用函数层层剥离,重构区块列表组件(下)
- 9-23 作业布置:修复前端删除引发的排序问题和添加 API 文档
- 9-24 作业回顾:修复前端删除引发的排序问题和添加 API 文档
- 9-25 作业布置:完成轮播图区块的在画布的拖放和编辑
- 9-26 作业回顾:完成轮播图区块的在画布的拖放和编辑
- 9-27 构建商品查询 API,Example 查询和 Query 查询的区别
- 9-28 作业布置:前端添加 ProductAdminRepository 和重构区块数据的 VM
- 9-29 作业回顾:前端添加 ProductAdminRepository 和重构区块数据的 VM
- 9-30 搭建商品数据表单编辑布局
- 9-31 改造 LeftPane 用于构建商品区块默认数据
- 9-32 前端使用 showSearch 完成商品搜索和选择
- 9-33 实现类目查询 API,使用函数实现查询并优化性能
- 9-34 作业布置:完成前端瀑布流区块的显示和编辑
- 9-35 作业回顾:完成前端瀑布流区块的显示和编辑
- 9-36 完成瀑布流区块沉底逻辑,唯一性错误提示,List 与 Set 的区别
- 9-37 区块移动 API 和前端对于瀑布流的处理
- 9-38 创建验证服务,减少冗余的验证方法
- 9-39 后端增加页面布局状态检查,重构前端自定义异常
- 9-40 自定义时间范围的验证注解和验证器
- 9-41 发布页面布局 API 日期冲突校验逻辑
本章将实现菜单权限新增和编辑表单开发,及其对应的后端API开发,并完成开发过程中各种问题修复和优化。
本章节主要涉及前端项目的讲解,包括前端项目的模块划分、插件的集成、业务的具体实现、路由管理的实现方案、状态管理的实现方案、组件的封装等等。该前端项目是一个标准的VUE3的项目,该项目的架构也完全是按照商业级的产品模块划分水准来做,内容丰富,可学性极强。
通过完成文章的编辑和删除功能,引出了之前组件留下的几个 bug,通过解决bug 带给大家持续优化的思路和方案,最后完成了一个通用 Modal 组件的编码过程。
对于一个复杂前端项目,在编码之前,分析过程可谓是“磨刀不误砍柴工”,本周我们来给大家讲解怎样一步步抽丝剥茧,从需求到难点,再到系统整体设计。
本章将演示代码生成器的制作,学习模板引擎freemarker的使用。通过代码生成器可以快速生成dto、service、controller和vue界面代码,再配合上mybatis generator,可以快速完成单表的增删改查管理功能,极大的提高开发效率。另外,本章的知识也可应用于静态页面生成、导出复杂excel等涉及文件生成的场景。
本章将完成github+gitee API接入,并完成下载器的实现流程设计
本章介绍了Web前端开发者职业发展和学习内容,包括不同等级工程师发展的能力要求、前端开发的技术范畴、学习步骤和学习内容、日常前端开发的工具和工作全流程、与同事协作的方法。介绍了Web网页基础知识,包括HTML、CSS、JS三大核心技术,浏览器兼容和页面布局,Dom技术,Ajax。理解大规模前端开发涉及的工程化、组件化,熟悉常用开发必备的框架。最后展望了前端发展趋势,了解大前端、微前端、低代码平台的概念和关键技术点。
- 6-1 常用浏览器及内核,为什么要浏览器兼容
- 6-2 前端学习指南:入门方法与学习策略
- 6-3 前端开发全流程详解:从设计到上线
- 6-4 前端开发工具与Bug调试技巧大揭秘
- 6-5 HTML、CSS、JavaScript:前端三大核心技术精讲
- 6-6 常用浏览器及内核,为什么要浏览器兼容
- 6-7 前端流行的布局方式,屏幕适配实战技巧
- 6-8 ES、JS、TS关系梳理:前端语言的进化之路
- 6-9 DOM操作、事件处理与Ajax异步应用深入解析
- 6-10 前端高效开发之道:工程化、模块化与组件化实践
- 6-11 主流前端框架详解:React、Angular、Vue必备指南
- 6-12 Node.js后端技术栈:前端开发的扩展领域
- 6-13 前端、后端、移动端、桌面端、小程序是什么
- 6-14 小程序开发实践:从零到一构建你的应用
- 6-15 前端工程优化与发布流程:质量与效率的双重保障
- 6-16 大前端趋势展望:前端技术的未来发展
- 6-17 微前端架构探索:引领前端未来的新方向
- 6-18 大厂前端开发标准与流程揭秘
- 6-19 低代码平台:前端前沿开发模式探索
实现微前端框架基础功能,包括:应用注册、路由拦截、主应用生命周期添加、微前端生命周期添加、加载和解析html、加载和解析js、渲染、执行脚本文件等内容。
本周从编辑器开始开发,完成编辑器的基本布局,并且分析组件属性和修改组件属性的对应关系,创建业务组件库的第一个组件,并且完成最简单的编辑器交互,最后提出了业务组件实时实现编辑更新的解决方案。
- 6-1 将编辑器数据结构添加至 vuex store
- 6-2 将编辑器数据结构添加至 vuex store
- 6-3 LText 组件初步实现
- 6-4 LText 添加通用属性
- 6-5 LText 使用 hooks 重用逻辑
- 6-6 完成点击模版列表添加到画布的行为
- 6-7 为业务组件属性添加类型的利弊
- 6-8 获取正在编辑的元素的属性
- 6-9 添加属性和表单的基础对应关系并展示
- 6-10 添加更多简单对应关系并展示
- 6-11 添加更多复杂对应关系并展示
- 6-12 分析展示和编辑属性的“金科玉律
- 6-13 添加编辑表单并更新界面 第一部分
- 6-14 添加编辑表单并更新界面 第二部分
- 6-15 提出优化需求,以及组件返回的真相
- 6-16 将文本转换为 vNode
- 6-17 方案一:使用 JSX 重写 PropsTable 组件
- 6-18 方案二:使用 render 函数实现桥梁
- 6-19 本周重点内容回顾和总结
本章从 前后端分离和 RESTful 概念入手,介绍了为学生提供的 swagger 调试工具如何使用,然后引入 axios,通过 vuex action 的添加,实现 async 改造 和 axios 拦截器的基本用法,最后还抽象出一个 Loader 组件的编码和实现过程。
- 7-1 前后端分离开发是什么
- 7-2 RESTful API 设计理念
- 7-3 使用 swagger在线文档查看接口详情
- 7-4 axios 的基本用法和独家后端API 使用(必看)
- 7-5 后端Icode终极使用方案
- 7-6 使用vuex action 发送异步请求
- 7-7 使用vuex action 发送异步请求第二部分
- 7-8 CreatePost 页面 ColumnId 类型报错的解决方案
- 7-9 使用 async 和 await 改造异步请求
- 7-10 使用axios拦截器添加loading效果
- 7-11 Loader 组件编码第一部分 - 基本实现
- 7-12 Loader 组件编码第二部分 - 使用 Teleport 进行改造
本章将详细分析菜单权限的实现原理,并开发后端菜单权限API,核心原理涉及vue-router的动态路由机制。
由于是前后端分离项目,包含前端,前端源码直接提供的噢~ 本章节会手把手带着大家把前端运行好,可以正常和手机互通,所以没接触过前端的小伙伴们不用怕的哟~
本章完成双闭环之“鉴权”闭环,经典的RBAC角色权限模型设计与实现,完成权限守卫功能开发。对接前端菜单页面,创建接口请求,实现不同用户角色登录之后访问不同的角色内容。
- 12-1 前端内容页:动态Form组件&封装新增编辑模态框
- 12-2 前端内容页:创建角色页面(创建路由)
- 12-3 前端内容页:创建角色页面&菜单管理内容页面
- 12-4 前端内容页:封装删除模态框组件(有作业)
- 12-5 前端内容页:封装useModal方法
- 12-6 前端内容页:动态Form组件&封装新增编辑模态框
- 12-7 前端内容页:完成动态Form组件及模态框数据传递
- 12-8 前端内容页:菜单&角色新增与编辑模态框(作业)
- 12-9 [扩展]Form双向数据绑定逻辑
- 12-10 后端开发:菜单及接口访问控制思想
- 12-11 创建角色:CURD控制器及服务对接数据库(nest-cli作业)
- 12-12 创建菜单及数据对接:数据库migrations相关(非常重要)
- 12-13 权限控制:RABC权限关联路由与控制器
- 12-14 基于策略的控制:流行的casl策略库介绍
- 12-15 权限控制:与casl集成并完成策略权限控制(挑战)
- 12-16 权限控制:与casl集成完成自定义装饰器与守卫
- 12-17 权限控制:与casl集成并完成策略权限控制(作业与奖励)
本章带你完整落地 AI 知识库前端开发。你将从前端构思,页面模块定位,再到控件的组合等交互逻辑,手把手带你写出可直接使用的前端代码,搭建AI知识库界面
深入学习Nestjs的常用装饰器,了解接口开发中的CURD操作(增删改查)从前端到后端的整个过程,同时在本章搭建前端项目,完成Vue3+Pinia+Vue-router全家桶与Boostrap 5.x的集成,实操前后端请求与响应的流程。
- 10-1 前端表单及模态框:创建新增、编辑、删除模态框
- 10-2 好用到飞起的前端HTTP Client:请求库Axios封装
- 10-3 前端登录页面:介绍Boostrap的栅格系统,完成登录页面(作业)
- 10-4 表单校验:登录表单Bootstrap校验,模拟发送请求
- 10-5 前端内容页:完成页面布局(创建路由)
- 10-6 前端详情页:完成表格布局(分页、筛选表单)
- 10-7 创建控制器:定义用户模块并创建控制器
- 10-8 进阶:使用 @Param 和 @Body 解析请求
- 10-9 查询:创建读取列表服务(业务分析&SQL基础)
- 10-10 查询:对接数据库查询操作(作业)
- 10-11 查询进阶:queryBuilder及几种JOIN的学习(1)
- 10-12 查询进阶:queryBuilder及几种JOIN的学习(2)
- 10-13 创建用户:创建及异常处理逻辑TypeORMFilter
- 10-14 (重要)remove&delete区别:控制器&服务&存储库命名规则
- 10-15 更新:操作&数据库更新对接
- 10-16 前端表单及模态框:创建新增、编辑、删除模态框
- 10-17 前后端联调:页面CURD操作及接口响应(作业)
渐进式地构建前端项目,开箱即用,与三方类库实现高内聚低耦合,打造高效的开发体验,方便项目后期升级以及其他技术型改造。
AST 抽象语法树、JavaScript AST、render 函数生成。在我们了解了整个编译的大步骤之后,接下来我们就需要深入各个步骤,来掌握编译器的执行过程了。
- 14-1 源码阅读:编译器第三步:生成 render 函数
- 14-2 扩展知识:JavaScript与有限自动状态机
- 14-3 扩展知识:扫描 tokens 构建 AST 结构的方案
- 14-4 源码阅读:编译器第一步:依据模板,生成 AST 抽象语法树
- 14-5 框架实现:构建 parse 方法,生成 context 实例
- 14-6 框架实现:构建有限自动状态机解析模板,扫描 token 生成 AST 结构
- 14-7 框架实现:生成 AST,构建测试
- 14-8 扩展知识:AST 到 JavaScript AST 的转化策略和注意事项
- 14-9 源码阅读:编译器第二步:转化 AST,得到 JavaScript AST 对象
- 14-10 框架实现:转化 JavaScript AST,构建深度优先的 AST 转化逻辑
- 14-11 框架实现:构建 transformXXX 方法,转化对应节点
- 14-12 框架实现:处理根节点的转化,生成 JavaScript AST
- 14-13 扩展知识:render 函数的生成方案
- 14-14 源码阅读:编译器第三步:生成 render 函数
- 14-15 框架实现:构建 CodegenContext 上下文对象
- 14-16 框架实现:解析 JavaScript AST,拼接 render 函数
- 14-17 框架实现:新建 compat 模块,把 render 转化为 function
- 14-18 总结
理解实时通信,使用netty的websocket编写服务端启动类、子处理器以及助手类。 理解JS相关的websocket api,简单使用hbuilder编写通信页面与netty交互并且使用web浏览器与手机端浏览器进行测试数据交互
面试官给出一个项目需求或者功能,让候选人做技术方案设计,考察综合能力。本章将通过多个面试题,讲解如何进行项目设计,包括抽象数据模型,总结功能和流程,制定技术方案等。
- 33-1 -设计一个H5编辑器的数据模型和核心功能-错误答案展示
- 33-2 扩展:如果你是一个项目的前端技术负责人,你的主要职责是什么?
- 33-3 -开始-学习要点和注意事项
- 33-4 -如何设计一个前端统计SDK-分析功能范围
- 33-5 -如何设计一个前端统计SDK-代码结构演示
- 33-6 -【连环问】sourcemap有何作用,如何配置
- 33-7 -SPA和MPA应该如何选择
- 33-8 -设计一个H5编辑器的数据模型和核心功能-错误答案展示
- 33-9 扩展知识补充:何时应该使用 SSR ,何时不用?
- 33-10 -设计一个H5编辑器的数据模型和核心功能-演示正确答案
- 33-11 -设计一个“用户-角色-权限”的模型和功能
- 33-12 -简单描述hybrid模板的更新流程
- 33-13 -开发一个H5抽奖页,需要后端提供哪些接口
- 33-14 -如果你是前端技术负责人,将如何做技术选型
- 33-15 -设计实现一个H5图片懒加载SDK
- 33-16 扩展知识补充:我们常说的 B 端和 C 端,有什么区别
- 33-17 重点及注意事项总结
每个编程学习者都从 hello world 开启。本章从开发工具到如何搭建基本网页骨架,更全面的让你成功从0 体验开发属于自己的第一个网页,跨过学习的第一个门槛。
本章通过智能体辅助结合MCP工具,实现知名开源项目的二次开发,完成小慕书城的管理端页面开发。