课程试听
阶段一 React高级
展开第一章 Typescript
1-1 Typescript介绍和基本使用
- 01-TypeScript是什么
- 02-TypeScript为什么要为JS添加类型支持
- 03-TS相比JS的优势
- 04-安装编译TS的工具包
- 05-编译并运行TS代码
- 06-简化运行TS的步骤
1-2 Typescript常用类型
- 07-TypeScript常用类型概述
- 08-类型注解
- 09-TypeScript常用基础类型分类介绍
- 10-原始类型
- 11-数组类型
- 12-联合类型
- 13-类型别名
- 14-函数类型（1 单独指定参数和返回值的类型）
- 15-函数类型（2 同时指定参数和返回值的类型）
- 16-void类型
- 17-函数可选参数
- 18-对象类型
- 19-对象可选属性
- 20-接口
- 21-接口和类型别名的对比
- 22-接口继承
- 23-元组
- 24-类型推论
- 25-类型断言
- 01-字面量类型
- 02-枚举类型
- 03-枚举成员的值以及数字枚举
- 04-字符串枚举
- 05-枚举的特点及原理
- 06-any类型
- 07-TS中的typeof运算符
1-3 Typescript高级类型
- 08-TypeScript高级类型概述
- 09-class的基本使用
- 10-class的构造函数
- 11-class实例方法
- 12-class继承（1 extends）
- 13-class继承（2implements）
- 14-class类的可见性修饰符（1public）
- 15-class类的可见性修饰符（2protected）
- 16-class类的可见性修饰符（3private）
- 17-readonly只读修饰符
- 18-类型兼容性的说明
- 19-对象之间的类型兼容性
- 20-接口之间的类型兼容性
- 21-函数之间的类型兼容性（1函数参数）
- 22-函数之间的类型兼容性（2函数参数）
- 23-函数之间的类型兼容性（3返回值）
- 01-交叉类型
- 02-交叉类型和接口之间的对比说明
- 03-泛型的基本使用
- 04-简化泛型函数调用
- 05-泛型约束
- 06-泛型约束（extends添加约束）
- 07-多个泛型变量的情况
- 08-泛型接口
- 09-数组是泛型接口
- 10-泛型类
- 11-泛型工具类型（1Partial）
- 12-泛型工具类型（2Readonly）
- 13-泛型工具类型（3Pick）
- 14-泛型工具类型（4Record）
- 15-索引签名类型
- 16-映射类型
- 17-映射类型（keyof）
- 18-分析泛型工具类型Partial的实现
- 19-索引查询类型（1基本使用）
- 20-索引查询类型（2同时查询多个）
1-4 类型声明文件
- 01-类型声明文件概述
- 02-TS中的两种文件类型
- 03-使用已有的类型声明文件（1内置类型声明文件）
- 04-使用已有的类型声明文件（2第三方库的类型声明文件）
- 05-创建自己的类型声明文件（1项目内共享类型）
- 06-创建自己的类型声明文件（2为已有JS文件提供类型声明的概述）
- 07-创建自己的类型声明文件（3为已有JS文件提供类型声明）
1-5 React+Typescript
- 08-在React中使用TypeScript概述
- 09-使用CRA创建支持TS的项目
- 10-React支持TS的项目目录结构说明
- 11-TS配置文件tsconfig.json的说明
- 12-通过命令行方式使用编译配置
- 13-React中的常用类型介绍
- 14-React函数组件的类型（1组件和属性类型）
- 15-React函数组件的类型（2属性默认值）
- 16-React函数组件的类型（3事件和事件对象）
- 17-React类组件的类型（1组件类型）
- 18-React类组件的类型（2组件属性）
- 19-React类组件的类型（3状态和事件）
- 20-任务列表案例介绍
- 21-展示任务列表功能
- 22-使用类型声明文件复用类型
- 23-添加任务功能基本实现
- 24-添加任务功能优化
第二章 React Hooks
2-1 Hooks基础
- 01-Hooks是什么
- 02-为什么要有Hooks
- 03-Hooks的优势
- 04-React Hooks基础介绍
- 05-useState的使用（1语法）
- 06-useState的使用（2体验）
- 07-使用useState后函数组件的执行过程
- 08-使用useState提供多个状态
- 09-useEffect的介绍以及side effect副作用的说明
- 10-useEffect的使用（1基础）
- 11-useEffect的使用（2依赖项）
- 12-useEffect的使用（3空数组依赖项）
- 13-useEffect的使用（4清理函数）
- 14-useEffect的使用（5发送请求）
2-2 Hooks基本应用
- 01-React Hooks应用介绍
- 02-todos案例（1展示任务列表）
- 03-todos案例（2添加任务）
- 04-todos案例（2添加任务优化）
- 05-todos案例（3切换任务完成状态）
- 06-todos案例（3切换任务完成状态优化）
- 07-todos案例（4删除任务）
- 08-todos案例（5数据持久化到localStorage中）
- 09-使用useRef操作DOM
- 10-useRef的两个注意点
- 11-TS 非空断言的使用
- 12-todos案例（6使用useRef改造添加任务功能）
- 13-Context的基本使用
- 14-useContext的使用
- 15-todos案例（7使用useContext重构）
- 16-todos案例（8使用useContext重构-优化）
- 01-useReducer的使用（1用法说明）
- 02-useReducer的使用（2用法体验）
- 03-todos案例（使用useReducer重构1）
- 04-todos案例（使用useReducer重构2）
- 05-自定义Hooks介绍
- 06-todos案例（使用自定义Hooks重构）
2-3 Hooks进阶
- 07-React Hooks进阶概述
- 08-函数组件的特性
- 09-函数组件的特性产生的问题说明
- 10-React.memo高阶组件的使用场景说明
- 11-React.memo的使用
- 12-React.memo采用浅对比的方式比较props
- 13-useCallback的使用场景说明
- 14-useCallback的使用
- 01-useMemo的使用
- 02-useMemo的用法（1模拟useCallback）
- 03-useMemo的用法（2模拟React.memo高阶组件）
- 04-useMemo的用法（3避免昂贵计算）
- 05-useRef的高级用法说明
- 06-useRef的高级用法（1保持引用相等）
- 07-useRef的高级用法（2获取最新值）
- 08-useRef的高级用法（3获取上一次的值）
- 09-useState的补充说明
- 10-Hooks原理（模拟实现useState-支持一次使用）
- 11-Hooks原理（模拟实现useState-支持一次使用完成）
- 12-Hooks原理（模拟实现useState-支持多次使用分析）
- 13-Hooks原理（模拟实现useState-完成）
- 14-Hooks原理（对比React中的useState以及Hooks的使用规则补充）
- 15-Hooks原理（模拟实现useEffect-无依赖调用）
- 16-Hooks原理（模拟实现useEffect-功能实现）
阶段二 多端跨平台
展开第一章 Dart基础
1-1 Dart基础语法（一）
- 01-Dart基础课程内容介绍
- 02-Dart简介-Dart可以做什么
- 03-Dart简介-搭建Dart开发环境-macOS
- 04-Dart简介-搭建Dart开发环境-Windows
- 05-Dart简介-VSCode安装Dart插件
- 06-Dart简介-Dart初体验
- 07-基础语法-变量
- 08-基础语法-常量
- 09-基础语法-数据类型-数值
- 10-基础语法-数据类型-布尔
- 11-基础语法-数据类型-字符串
- 12-基础语法-数据类型-列表-定义和基本使用
- 13-基础语法-数据类型-列表-遍历
- 14-基础语法-数据类型-字典
- 15-基础语法-数据类型-Dart空安全机制
- 16-基础语法-运算符-算术运算符
- 17-基础语法-运算符-赋值运算符
- 18-基础语法-运算符-比较运算符
- 19-基础语法-运算符-逻辑运算符
- 20-基础语法-流程控制-if 语句
- 21-基础语法-流程控制-补充：三元运算符
- 22-基础语法-流程控制-switch case 语句
- 23-基础语法-流程控制-for 循环语句
- 24-基础语法-综合案例
1-2 Dart基础语法（二）
- 01-函数-函数定义
- 02-函数-函数特点
- 03-函数-可选和默认参数
- 04-函数-函数对象
- 05-函数-箭头函数
- 06-函数-匿名函数
- 07-函数-综合案例
- 08-类-类的定义
- 09-类-构造函数_类名构造函数
- 10-类-构造函数_命名构造函数
- 11-类-构造函数_工厂构造函数
- 12-类-私有属性和方法
- 13-类-继承_实现
- 14-类-继承_特点
- 15-类-mixin
- 16-异步编程-Future_基本使用
- 17-异步编程-Future_链式调用
- 18-异步编程-async - await
- 19-dynamic类型
- 20-泛型-限定类型
- 21-泛型-减少重复代码
- 22-异常
- 23-Dart基础内容回顾
第二章 Flutter基础
2-1 Flutter简介
- 01-Flutter基础课程内容介绍
- 02-Flutter简介-Flutter可以做什么
- 03-Flutter简介-搭建Flutter开发环境(Mac)-安装 Flutter SDK
- 04-Flutter简介-搭建Flutter开发环境(Mac)-安装 Android SDK
- 05-Flutter简介-搭建Flutter开发环境(Mac)-创建 Android 模拟器
- 06-Flutter简介-搭建Flutter开发环境(Windows)-安装 Flutter SDK（系统环境变量）
- 07-Flutter简介-搭建Flutter开发环境(Windows)-安装 Flutter SDK（设置镜像）
- 08-Flutter简介-搭建Flutter开发环境(Windows)-安装 Android SDK和模拟器
- 09-Flutter简介-搭建Flutter开发环境-安装 Dart和Flutter 插件（VSCode）
- 10-Flutter简介-Flutter初体验-创建Flutter工程并启动运行
- 11-Flutter简介-Flutter初体验-工程目录结构
- 12-Flutter简介-Flutter初体验-示例程序说明1
- 13-Flutter简介-Flutter初体验-示例程序说明2
2-2 Flutter常用组件-简介
- 14-Flutter常用组件-组件简介
- 15-Flutter常用组件-组件简介-无状态组件-定义
- 16-Flutter常用组件-组件简介-无状态组件-刷新界面
- 17-Flutter常用组件-组件简介-有状态组件-定义
- 18-Flutter常用组件-组件简介-有状态组件-刷新界面
- 19-Flutter常用组件-组件简介-组件生命周期
2-3 Flutter常用组件-基础组件
- 20-Flutter常用组件-基础组件-Container组件-页面组件准备
- 21-Flutter常用组件-基础组件-Container组件
- 22-Flutter常用组件-基础组件-Text组件
- 23-Flutter常用组件-基础组件-Image组件-加载网络图片
- 24-Flutter常用组件-基础组件-Image组件-本地静态图片
2-4 Flutter常用组件-布局组件
- 01-Flutter常用组件-布局组件-线性布局-Column组件
- 02-Flutter常用组件-布局组件-线性布局-Row组件
- 03-Flutter常用组件-布局组件-弹性布局-Expanded组件
- 04-Flutter常用组件-布局组件-层叠布局-Stack和Positioned组件
2-5 Flutter常用组件-综合案例
- 05-Flutter常用组件-综合案例-界面结构分析
- 06-Flutter常用组件-综合案例-订单创建时间和状态
- 07-Flutter常用组件-综合案例-商品图片
- 08-Flutter常用组件-综合案例-商品名称和数量
- 09-Flutter常用组件-综合案例-商品规格和单价
- 10-Flutter常用组件-综合案例-商品总价和再次购买
2-6 Flutter常用组件-滚动组件
- 11-Flutter常用组件-滚动组件-内容介绍
- 12-Flutter常用组件-滚动组件-ListView组件-默认构造函数
- 13-Flutter常用组件-滚动组件-ListView组件-命名构造函数builder
- 14-Flutter常用组件-滚动组件-ListView组件-命名构造函数separated
- 15-Flutter常用组件-滚动组件-GridView组件-默认构造函数-布局方式1
- 16-Flutter常用组件-滚动组件-GridView组件-默认构造函数-布局方式2
- 17-Flutter常用组件-滚动组件-GridView组件-命名构造函数builder
- 18-Flutter常用组件-滚动组件-GridView组件-命名构造函数count和extent
- 19-Flutter常用组件-滚动组件-CustomScrollView组件
2-7 Flutter常用组件-动画组件
- 20-Flutter常用组件-动画组件-内容介绍
- 21-Flutter常用组件-动画组件-平移动画分析
- 22-Flutter常用组件-动画组件-平移动画实现-动画控制器和动画对象
- 23-Flutter常用组件-动画组件-平移动画实现-设置动画状态
- 24-Flutter常用组件-动画组件-缩放动画
2-8 网络请求-dio插件
- 25-网络请求-dio插件-介绍和安装
- 26-网络请求-dio插件-基本使用
- 27-网络请求-dio插件-综合案例
- 28-Flutter基础总结回顾
第三章 Flutter 小兔鲜儿项目
3-1 项目准备
- 01-项目简介
- 02-项目准备-项目开发配套资料
- 03-项目准备-创建小兔鲜儿APP工程
- 04-项目准备-根据业务模块准备目录结构
3-2 APP根页面
- 05-APP根页面-内容介绍
- 06-APP根页面-准备APP根页面组件
- 07-APP根页面-展示页面内容
- 08-APP根页面-展示底部导航
- 09-APP根页面-处理交互-切换底部导航
- 10-APP根页面-处理交互-切换页面内容
- 11-APP根页面-处理交互-优化底部导航交互效果-去除点击和长按时的背景色
- 12-APP根页面-处理交互-优化底部导航交互效果-统一选中和未选中状态的字号
- 13-APP根页面-优化底部导航图标和文字-准备设计稿图标
- 14-APP根页面-优化底部导航图标和文字-展示设计稿图标
- 15-APP根页面-优化底部导航图标和文字-设置选中和未选中状态的文字颜色
- 16-APP根页面-优化底部导航图标和文字-解决切换底部导航Item时图标闪动问题
- 17-APP根页面-小结
3-3 底部导航帧动画
- 18-扩展-底部导航帧动画-内容介绍
- 19-扩展-底部导航帧动画-自定义帧动画组件-实现步骤说明
- 20-扩展-底部导航帧动画-自定义帧动画组件-创建动画控制器和动画对象
- 21-扩展-底部导航帧动画-自定义帧动画组件-定义控制动画的方法
- 22-扩展-底部导航帧动画-自定义帧动画组件-实现帧动画效果（重要）
- 23-扩展-底部导航帧动画-自定义帧动画组件-展示帧动画组件
- 24-扩展-底部导航帧动画-切换底部导航帧动画-实现方案
- 25-扩展-底部导航帧动画-切换底部导航帧动画-准备帧动画组件的Key
- 26-扩展-底部导航帧动画-切换底部导航帧动画-调用控制动画的方法切换帧动画
- 27-扩展-底部导航帧动画-切换底部导航帧动画-避免重复点击Item（优化）
- 28-扩展-底部导航帧动画-展示设计稿帧动画-接收帧动画图片和修改帧动画策略
- 29-扩展-底部导航帧动画-展示设计稿帧动画-加载并传入帧动画图片
3-4 网络数据访问
- 01-网络数据访问-内容介绍
- 02-网络数据访问-dio插件-获取首页网络数据
- 03-网络数据访问-网络请求单例类-为什么要封装网络请求单例类
- 04-网络数据访问-网络请求单例类-实现和测试
- 05-网络数据访问-网络请求单例类-创建Dio实例并使用
- 06-网络数据访问-网络请求单例类-设置全局配置信息
- 07-网络数据访问-网络请求单例类-设置全局的请求头信息-dio插件的拦截器介绍
- 08-网络数据访问-网络请求单例类-设置全局的请求头信息-实现
- 09-网络数据访问-网络请求单例类-封装处理请求的公共方法-dio插件的request()方法介绍
- 10-网络数据访问-网络请求单例类-封装处理请求的公共方法-实现
- 11-网络数据访问-网络请求单例类-小结
- 12-网络数据访问-接口方法-封装首页接口方法
- 13-网络数据访问-数据模型-内容介绍
- 14-网络数据访问-数据模型-为什么要将网络数据转模型数据
- 15-网络数据访问-数据模型-什么是数据模型
- 16-网络数据访问-数据模型-如何将网络数据转模型数据
- 17-网络数据访问-数据模型-首页网络数据转模型数据-定义总数据模型
- 18-网络数据访问-数据模型-首页网络数据转模型数据-接口方法中使用总数据模型
- 19-网络数据访问-数据模型-首页网络数据转模型数据-断点调试总数据模型
- 20-网络数据访问-数据模型-首页网络数据转模型数据-定义图片轮播图数据模型
- 21-网络数据访问-数据模型-首页网络数据转模型数据-图片轮播图字典列表转模型列表
- 22-网络数据访问-数据模型-首页网络数据转模型数据-断点调试图片轮播图数据模型
- 23-网络数据访问-数据模型-首页网络数据转模型数据-分类导航数据模型
- 24-网络数据访问-数据模型-首页网络数据转模型数据-分类导航数据模型嵌套分类商品数据模型
- 25-网络数据访问-数据模型-首页网络数据转模型数据-其他数据模型
- 26-网络数据访问-数据模型-小结
- 27-补充-开发环境打印输出信息-debugPrint
3-5 首页布局和样式（一）
- 01-首页模块内容介绍
- 02-首页布局和样式-结构分析和代码准备
- 03-首页布局和样式-轮播图-实现方案说明
- 04-首页布局和样式-轮播图-插件介绍和安装
- 05-首页布局和样式-轮播图-使用插件展示轮播图
- 06-首页布局和样式-轮播图-自定义轮播图组件
- 07-首页布局和样式-轮播图-自定义轮播图组件-轮播图加载中
- 08-首页布局和样式-轮播图-自定义轮播图指示器-方案说明
- 09-首页布局和样式-轮播图-自定义轮播图指示器-矩形
- 10-首页布局和样式-轮播图-自定义轮播图指示器-圆形
- 11-首页布局和样式-轮播图-小结
- 12-首页布局和样式-分类快捷入口-实现方案说明
- 13-首页布局和样式-分类快捷入口-组件和数据准备
- 14-首页布局和样式-分类快捷入口-分页效果-使用PageView组件实现分页效果
- 15-首页布局和样式-分类快捷入口-网格效果-插件介绍和安装
- 16-首页布局和样式-分类快捷入口-网格效果-展示分类网格信息-计算分页总页数
- 17-首页布局和样式-分类快捷入口-网格效果-展示分类网格信息和禁用滚动
- 18-首页布局和样式-分类快捷入口-网格效果-设置分类网格样式
- 19-首页布局和样式-分类快捷入口-网格效果-分页展示分类网格信息
- 20-首页布局和样式-分类快捷入口-高度变化的动画效果-AnimatedContainer
- 21-首页布局和样式-分类快捷入口-分页指示器
- 22-首页布局和样式-分类快捷入口-小结
3-6 首页布局和样式（二）
- 01-首页布局和样式-热门推荐-结构分析
- 02-首页布局和样式-热门推荐-准备组件和数据
- 03-首页布局和样式-热门推荐-准备StaggeredGridView组件
- 04-首页布局和样式-热门推荐-实现布局和样式-主标题和副标题
- 05-首页布局和样式-热门推荐-实现布局和样式-左右图片
- 06-首页布局和样式-新鲜好物-结构分析
- 07-首页布局和样式-新鲜好物-准备组件和数据
- 08-首页布局和样式-新鲜好物-布局和样式-标题
- 09-首页布局和样式-新鲜好物-布局和样式-内容
- 10-首页布局和样式-新鲜好物-布局和样式-使用RichText组件展示价格
- 11-首页布局和样式-新鲜好物-自定义价格组件
- 12-首页布局和样式-热门品牌
- 13-首页布局和样式-热门专题
- 14-首页布局和样式-推荐分类导航和商品-实现方案说明
- 15-首页布局和样式-推荐分类导航和商品-吸顶分类导航-SliverPersistentHeader组件展示吸顶效果
- 16-首页布局和样式-推荐分类导航和商品-吸顶分类导航-TabBar组件展示分类导航内容
- 17-首页布局和样式-推荐分类导航和商品-吸顶分类导航-设置分类导航内容样式
- 18-首页布局和样式-推荐分类导航和商品-吸顶分类导航-展示分类导航分割线
- 19-首页布局和样式-推荐分类导航和商品-分类商品-TabBarView组件展示分类商品
- 20-首页布局和样式-推荐分类导航和商品-分类商品-设置TabBarView组件高度
- 21-首页布局和样式-推荐分类导航和商品-分类商品-修复BUG
3-7 首页AppBar组件
- 01-首页AppBar组件-首页AppBar介绍
- 02-首页AppBar组件-准备AppBar组件
- 03-首页AppBar组件-展示背景图
- 04-首页AppBar组件-构建基本布局
- 05-首页AppBar组件-构建基本布局-解决内容遮挡和设置高度
- 06-首页AppBar组件-构建搜索框
- 07-首页AppBar组件-点击事件
- 08-首页AppBar组件-设置状态栏颜色
- 09-首页AppBar组件-小结
3-8 加载网络图片
- 10-加载网络图片-内容介绍
- 11-加载网络图片-cached_network_image插件-介绍和安装
- 12-加载网络图片-cached_network_image插件-基本使用
- 13-加载网络图片-自定义加载网络图片组件-实现加载网络图片功能
- 14-加载网络图片-自定义加载网络图片组件-设置占位图和处理异常
- 15-加载网络图片-自定义加载网络图片组件-替换Image组件
- 16-加载网络图片-小结
3-9 数据刷新
- 17-数据刷新-pull_to_refresh插件-介绍和安装
- 18-数据刷新-pull_to_refresh插件-基本使用-下拉刷新
- 19-数据刷新-pull_to_refresh插件-基本使用-上拉加载更多
- 20-数据刷新-自定义刷新数据组件-实现下拉刷新和上拉加载更多的功能
- 21-数据刷新-自定义刷新数据组件-下拉刷新动画效果
- 22-数据刷新-小结
- 23-首页骨架屏-骨架屏介绍和实现
3-10 一键回到顶部
- 24-一键回到顶部-实现方案说明
- 25-一键回到顶部-构建回到顶部按钮
- 26-一键回到顶部-显示和隐藏回到顶部按钮
- 27-一键回到顶部-回到顶部逻辑实现
- 28-一键回到顶部-小结
3-11 首页优化
- 29-首页优化-解决首页重复渲染的问题-解决方案说明
- 30-首页优化-解决首页重复渲染的问题-PageView组件管理APP根页面的页面组件
- 31-首页优化-解决首页重复渲染的问题-AutomaticKeepAliveClientMixin记录页面的状态
- 32-首页-总结
3-12 商品分类
- 01-商品分类-模块内容介绍
- 02-商品分类-一级分类展示-准备商品分类页面组件
- 03-商品分类-一级分类展示-获取一级分类数据
- 04-商品分类-一级分类展示-一级分类数据转模型数据
- 05-商品分类-一级分类展示-展示一级分类数据
- 06-商品分类-一级分类展示-小结
- 07-商品分类-一级分类交互-效果说明
- 08-商品分类-一级分类交互-展示选中和未选中状态
- 09-商品分类-一级分类交互-选中并居中-实现方案说明
- 10-商品分类-一级分类交互-选中并居中-逻辑实现
- 11-商品分类-一级分类交互-限制最小和最大滚动范围
- 12-商品分类-一级分类交互-小结
- 13-商品分类-二级分类展示-效果说明
- 14-商品分类-二级分类展示-获取二级分类及商品数据
- 15-商品分类-二级分类展示-二级分类数据转模型数据
- 16-商品分类-二级分类展示-展示二级分类和商品数据
- 17-商品分类-二级分类展示-一级分类联动二级分类
- 18-商品分类-二级分类展示-小结
- 19-商品分类-二级分类缓存-效果说明
- 20-商品分类-二级分类缓存-缓存方案说明
- 21-商品分类-二级分类缓存-缓存二级分类和商品
- 22-商品分类-二级分类缓存-自定义loading组件
- 23-商品分类-二级分类缓存-使用loading组件
- 24-商品分类-总结
3-13 用户账号（一）
- 01-用户账号-模块内容介绍
- 02-用户账号-账号密码登录-准备页面组件-首页跳转到登录页
- 03-用户账号-账号密码登录-准备页面组件-页面顶部导航栏
- 04-用户账号-账号密码登录-准备页面组件-页面内容介绍
- 05-用户账号-账号密码登录-准备页面组件-补充页面内容
- 06-用户账号-账号密码登录-账号密码文本输入框-一键清空输入框-监听账号文本输入
- 07-用户账号-账号密码登录-账号密码文本输入框-一键清空输入框-展示一键清除按钮
- 08-用户账号-账号密码登录-账号密码文本输入框-一键清空输入框-逻辑实现
- 09-用户账号-账号密码登录-账号密码文本输入框-点击空白处隐藏键盘
- 10-用户账号-账号密码登录-账号密码文本输入框-展示密文密码
- 11-用户账号-账号密码登录-账号密码文本输入框-监听输入框焦点（展示捂眼小兔子）
- 12-用户账号-账号密码登录-账号密码文本输入框-小结
- 13-用户账号-账号密码登录-勾选用户协议
- 14-用户账号-账号密码登录-登录逻辑-校验登录信息-判断账号和密码是否都有内容
- 15-用户账号-账号密码登录-登录逻辑-校验登录信息-账号、密码和用户协议
- 16-用户账号-账号密码登录-登录逻辑-校验登录信息-使用flutter_easyloading插件展示提示信息
- 17-用户账号-账号密码登录-登录逻辑-发送登录请求-定义并调用账号密码登录接口方法
- 18-用户账号-账号密码登录-登录逻辑-发送登录请求-处理登录结果
- 19-用户账号-账号密码登录-登录逻辑-小结
- 20-用户账号-账号密码登录-本地缓存用户信息-shared_preferences插件介绍和安装
- 21-用户账号-账号密码登录-本地缓存用户信息-shared_preferences插件本地缓存用户信息
- 22-用户账号-账号密码登录-本地缓存用户信息-shared_preferences插件读取本地缓存的用户信息
- 23-用户账号-账号密码登录-本地缓存用户信息-补充全局请求头的Authorization字段
- 24-用户账号-账号密码登录-本地缓存用户信息-小结
3-14 用户账号（二）
- 01-用户账号-账号密码登录-刷新token-为什么要刷新token
- 02-用户账号-账号密码登录-刷新token-如何刷新token
- 03-用户账号-账号密码登录-刷新token-监听错误码401
- 04-用户账号-账号密码登录-刷新token-请求刷新token接口获取新Token
- 05-用户账号-账号密码登录-刷新token-刷新成功-使用新token再次发起请求
- 06-用户账号-账号密码登录-刷新token-刷新失败-跳转到账号密码登录页面
- 07-用户账号-账号密码登录-刷新token-小结
- 08-用户账号-短信验证码-效果演示
- 09-用户账号-短信验证码-准备输入手机号页面组件
- 10-用户账号-短信验证码-校验手机号是否已注册-定义校验账号唯一接口方法
- 11-用户账号-短信验证码-校验手机号是否已注册-调用校验账号唯一接口方法
- 12-用户账号-短信验证码-校验手机号是否已注册-校验通过-跳转到获取验证码页面
- 13-用户账号-短信验证码-倒计时-Timer基本使用
- 14-用户账号-短信验证码-倒计时-展示倒计时
- 15-用户账号-短信验证码-倒计时-停止倒计时
- 16-用户账号-短信验证码-倒计时-避免频繁点击发送验证码
- 17-用户账号-短信验证码-获取短信验证码-接收手机号码
- 18-用户账号-短信验证码-获取短信验证码-定义接口方法
- 19-用户账号-短信验证码-获取短信验证码-调用接口方法
- 20-用户账号-短信验证码-校验短信验证码-定义接口方法
- 21-用户账号-短信验证码-校验短信验证码-调用接口方法
- 22-用户账号-短信验证码-校验短信验证码-校验通过-停止倒计时并跳转到用户注册页面
- 23-用户账号-短信验证码-小结
- 24-用户账号-用户注册-效果演示
- 25-用户账号-用户注册-接收手机号和短信验证码
- 26-用户账号-用户注册-定义用户注册接口方法
- 27-用户账号-用户注册-调用用户注册接口方法
- 28-用户账号-用户注册-注册成功-跳转到登录页（有问题的方式）
- 29-用户账号-用户注册-注册成功-跳转到登录页(正确的方式)
- 30-用户账号-账号密码登录-刷新token-BUG修复
- 31-用户账号-总结
3-15 商品详情（一）
- 01-商品详情-模块内容介绍
- 02-商品详情-准备商品详情页面组件-页面结构分析
- 03-商品详情-准备商品详情页面组件-页面结构搭建
- 04-商品详情-获取商品详情数据-定义商品详情接口方法
- 05-商品详情-获取商品详情数据-调用商品详情接口方法
- 06-商品详情-获取商品详情数据-商品详情数据转模型数据
- 07-商品详情-展示商品详情内容-展示loading动效
- 08-商品详情-展示商品详情内容
- 09-商品详情-展示商品详情内容-底部操作栏
- 10-商品详情-顶部导航栏-展示顶部导航栏
- 11-商品详情-顶部导航栏-导航栏渐变-实现方案说明-Opacity组件
- 12-商品详情-顶部导航栏-导航栏渐变-顶部普通导航栏-监听商品详情页滚动
- 13-商品详情-顶部导航栏-导航栏渐变-顶部普通导航栏-计算顶部导航栏透明度
- 14-商品详情-顶部导航栏-导航栏渐变-顶部普通导航栏-导航栏接收并设置透明度
- 15-商品详情-顶部导航栏-导航栏渐变-顶部标题导航栏-导航栏渐变效果实现
- 16-商品详情-顶部导航栏-导航栏渐变-小结
- 17-商品详情-顶部导航栏-导航栏切换商品详情内容-实现方案说明-TabBar组件
- 18-商品详情-顶部导航栏-导航栏切换商品详情内容-展示导航栏标题
- 19-商品详情-顶部导航栏-导航栏切换商品详情内容-滚动商品详情页切换导航栏标题-获取详情内容位置
- 20-商品详情-顶部导航栏-导航栏切换商品详情内容-滚动商品详情页切换导航栏标题-根据位置切换标题
- 21-商品详情-顶部导航栏-导航栏切换商品详情内容-点击导航栏标题定位商品内容-监听导航标题点击事件
- 22-商品详情-顶部导航栏-导航栏切换商品详情内容-点击导航栏标题定位商品内容-定位商品详情内容
- 23-商品详情-顶部导航栏-导航栏切换商品详情内容-点击导航栏标题定位商品内容-区分点击和滚动事件
- 24-商品详情-顶部导航栏-导航栏切换商品详情内容-点击导航栏标题定位商品内容-控制导航栏标题事件输入
- 25-商品详情-顶部导航栏-导航栏切换商品详情内容-小结
3-16 商品详情（二）
- 01-商品详情-商品规格-效果演示
- 02-商品详情-商品规格-展示商品规格-商品规格弹窗
- 03-商品详情-商品规格-展示商品规格-商品基本信息
- 04-商品详情-商品规格-展示商品规格-商品规格名称
- 05-商品详情-商品规格-展示商品规格-商品规格值
- 06-商品详情-商品规格-展示商品规格-准备规格状态样式（选中、未选中、禁用）
- 07-商品详情-商品规格-展示商品规格-小结
- 08-商品详情-商品规格-选择商品规格-效果演示
- 09-商品详情-商品规格-选择商品规格-展示规格选中和未选中状态
- 10-商品详情-商品规格-选择商品规格-展示规格禁用状态-SKU介绍
- 11-商品详情-商品规格-选择商品规格-展示规格禁用状态-实现思路
- 12-商品详情-商品规格-选择商品规格-展示规格禁用状态-规格路径字典-提取有库存的SKU规格
- 13-商品详情-商品规格-选择商品规格-展示规格禁用状态-规格路径字典-计算有库存的规格幂集
- 14-商品详情-商品规格-选择商品规格-展示规格禁用状态-规格路径字典-生成有库存的规格路径字典
- 15-商品详情-商品规格-选择商品规格-展示规格禁用状态-匹配规格路径-获取已选中的规格
- 16-商品详情-商品规格-选择商品规格-展示规格禁用状态-匹配规格路径-生成规格路径key
- 17-商品详情-商品规格-选择商品规格-展示规格禁用状态-匹配规格路径-匹配规格路径字典
- 18-商品详情-商品规格-选择商品规格-展示规格禁用状态-匹配规格路径-展示规格禁用状态
- 19-商品详情-商品规格-选择商品规格-展示规格禁用状态-小结
- 20-商品详情-商品规格-展示选中商品信息-效果演示
- 21-商品详情-商品规格-展示选中商品信息-获取选中SKU
- 22-商品详情-商品规格-展示选中商品信息-展示已选价格
- 23-商品详情-商品规格-展示选中商品信息-展示已选规格
- 24-商品详情-商品规格-展示选中商品信息-关闭规格弹窗同步已选规格
3-17 商品详情（三）
- 01-商品详情-商品规格-底部操作栏-效果演示
- 02-商品详情-商品规格-底部操作栏-准备商品规格弹窗公共入口
- 03-商品详情-商品规格-底部操作栏-展示商品规格弹窗底部操作栏
- 04-商品详情-商品规格-底部操作栏-区分加入购物车和立即购买逻辑
- 05-商品详情-商品规格-底部操作栏-加入购物车和立即购买时校验规格
- 06-商品详情-收货地址-效果演示
- 07-商品详情-收货地址-展示收货地址弹窗
- 08-商品详情-收货地址-展示默认地址
- 09-商品详情-收货地址-选择收货地址
3-18 购物车（一）
- 10-购物车-模块内容介绍
- 11-购物车-添加购物车-定义接口方法1
- 11-购物车-添加购物车-定义接口方法2
- 12-购物车-添加购物车-调用接口方法
- 13-购物车-展示购物车-准备购物车页面
- 14-购物车-展示购物车-获取购物车数据
- 15-购物车-展示购物车-购物车数据转模型数据
- 16-购物车-展示购物车-渲染购物车数据
- 17-购物车-展示购物车-下拉刷新购物车
- 18-购物车-修改购物车-定义并调用接口方法
- 19-购物车-修改购物车-更新购物车列表
- 20-购物车-删除购物车-侧滑插件介绍
- 21-购物车-删除购物车-展示侧滑操作面板
- 22-购物车-删除购物车-展示删除对话框
- 23-购物车-删除购物车-逻辑实现
- 24-购物车-删除购物车-关闭侧滑操作面板（有BUG）
- 25-购物车-删除购物车-关闭侧滑操作面板（修复BUG）
- 26-购物车-全选购物车-展示是否全选
- 27-购物车-全选购物车-控制是否全选
- 28-购物车-价格合计
3-19 购物车（二）+订单和支付（一）
- 01-购物车-同步购物车数量-获取购物车总数量
- 02-购物车-同步购物车数量-展示购物车总数量
- 03-购物车-同步购物车数量-跨组件同步购物车总数量-ValueListenableBuilder组件介绍
- 04-购物车-同步购物车数量-跨组件同步购物车总数量-ValueListenableBuilder组件使用
- 05-购物车-同步购物车数量-跨组件同步购物车总数量-BUG修复
- 06-购物车-空购物车-展示空购物车
- 07-购物车-空购物车-回到首页-popUntil方法
- 08-购物车-空购物车-回到首页-event_bus插件介绍
- 09-购物车-空购物车-回到首页-event_bus插件使用
- 10-购物车-未登录状态-拦截获取购物车数据时Token异常
- 11-购物车-未登录状态-展示未登录界面-通知购物车页面Token异常
- 12-购物车-未登录状态-展示未登录界面
- 13-购物车-未登录状态-登录成功刷新购物车
- 14-购物车-未登录状态-修复BUG
- 15-购物车-猜你喜欢-获取猜你喜欢数据
- 16-购物车-猜你喜欢-展示猜你喜欢数据
- 17-订单和支付-模块内容介绍
- 18-订单和支付-订单结算-准备订单结算页面
- 19-订单和支付-订单结算-获取订单结算数据-定义订单结算接口方法
- 20-订单和支付-订单结算-生成订单结算数据-调用订单结算接口方法
- 21-订单和支付-订单结算-订单结算数据转模型数据
- 22-订单和支付-订单结算-展示订单结算数据（结算商品和金额）
- 23-订单和支付-订单结算-选择并展示收货地址
- 24-订单和支付-订单结算-小结
- 25-订单和支付-立即购买-发送立即购买请求-定义立即购买接口方法
- 26-订单和支付-立即购买-发送立即购买请求-调用立即购买接口方法
- 27-订单和支付-立即购买-展示立即购买结算数据
- 28-订单和支付-提交订单-准备待提交订单数据
- 29-订单和支付-提交订单-发送提交订单请求
3-20 订单和支付（二）
- 01-订单和支付-支付宝支付-效果演示
- 02-订单和支付-支付宝支付-实现方案
- 03-订单和支付-支付宝支付-发起支付宝支付请求
- 04-订单和支付-支付宝支付-tobias插件介绍
- 05-订单和支付-支付宝支付-唤起支付宝并支付-检查是否已安装支付宝APP
- 06-订单和支付-支付宝支付-唤起支付宝并支付
- 07-订单和支付-支付宝支付-处理支付结果-判断支付状态
- 08-订单和支付-支付宝支付-处理支付结果-支付成功
- 09-订单和支付-支付宝支付-处理支付结果-取消支付-准备待支付页面
- 10-订单和支付-支付宝支付-处理支付结果-取消支付-获取支付详情数据
- 11-订单和支付-支付宝支付-处理支付结果-取消支付-展示支付金额
- 12-订单和支付-支付宝支付-处理支付结果-取消支付-展示支付超时倒计时
- 13-订单和支付-支付宝支付-处理支付结果-取消支付-展示支付超时提示框
- 14-订单和支付-支付宝支付-处理支付结果-取消支付-确定付款
- 15-订单和支付-支付宝支付-处理支付结果-支付失败
- 16-订单和支付-支付宝支付-小结
- 17-订单和支付-订单列表-效果演示
- 18-订单和支付-订单列表-展示订单列表-准备订单列表页面
- 19-订单和支付-订单列表-展示订单列表-获取订单列表数据
- 20-订单和支付-订单列表-展示订单列表-订单列表数据转模型数据
- 21-订单和支付-订单列表-展示订单列表-渲染订单列表数据-订单和商品信息
- 22-订单和支付-订单列表-展示订单列表-渲染订单列表数据-订单状态操作栏
- 23-订单和支付-订单列表-展示订单列表-渲染订单列表数据-空订单列表
- 24-订单和支付-订单列表-刷新订单列表-下拉刷新列表
- 25-订单和支付-订单列表-刷新订单列表-上拉加载更多
- 26-订单和支付-订单列表-订单状态操作栏交互-继续支付
- 27-订单和支付-订单列表-订单状态操作栏交互-取消订单
- 28-订单和支付-订单列表-小结
3-21 用户中心
- 01-用户中心-模块内容介绍
- 02-用户中心-个人信息-准备用户中心页面
- 03-用户中心-个人信息-获取个人信息
- 04-用户中心-个人信息-个人信息转模型数据
- 05-用户中心-个人信息-局部刷新个人信息
- 06-用户中心-打开订单列表页
- 07-用户中心-Flutter和网页混合开发-实现方案介绍
- 08-用户中心-Flutter和网页混合开发-展示个人中心网页-判断用户是否登录
- 09-用户中心-Flutter和网页混合开发-展示个人中心网页-webview_flutter插件-介绍和安装
- 10-用户中心-Flutter和网页混合开发-展示个人中心网页-webview_flutter插件-基本使用
- 11-用户中心-Flutter和网页混合开发-Flutter和网页通信-Flutter调用网页JS方法-注入token
- 12-用户中心-Flutter和网页混合开发-Flutter和网页通信-网页向Flutter发送消息-返回上一级页面
- 13-用户中心-Flutter和网页混合开发-修改用户头像-实现方案介绍
- 14-用户中心-Flutter和网页混合开发-修改用户头像-监听用户头像点击事件
- 15-用户中心-Flutter和网页混合开发-修改用户头像-监听用户头像点击事件-展示拍照和我的相册对话框
- 16-用户中心-Flutter和网页混合开发-修改用户头像-拍照和相册-image_picker插件-介绍和安装
- 17-用户中心-Flutter和网页混合开发-修改用户头像-拍照和相册-image_picker插件-基本使用
- 18-用户中心-Flutter和网页混合开发-修改用户头像-注入并展示用户头像
- 19-用户中心-Flutter和网页混合开发-修改用户头像-更新用户个人信息
- 20-用户中心-Flutter和网页混合开发-退出登录
- 21-用户中心-Flutter和网页混合开发-小结
第四章 小兔鲜儿原生小程序精讲
4-1 小兔鲜儿项目介绍及初始化配置
- 01-小兔鲜儿功能介绍及技术选型说明
- 02-创建小兔鲜儿项目并熟悉目录结构
- 03-熟悉小兔鲜儿的接口文档使用及规范
4-2 封装网络请求
- 04-为什么要封装wx.request
- 05-封装 wx.request 支持 promise 步骤分析
- 06-封装 wx.request 支持 promise 的基本实现
- 07-处理 wx.request 封装的请求参数
- 08-变更封装promise的状态
- 09-封装 wx.request 支持 loading 消息提示
- 10-loading提示优化方案分析
- 11-loading提示框优化实现
- 12-封装 wx.request 支持 defaults 默认配置
- 13-封装 wx.request 支持拦截器的实现步骤分析
- 14-实现请求拦截器功能
- 15-实现请求拦截器功能
- 16-封装 wx.request 支持并发请求的必要性
- 17-实现并发请求处理的功能
- 18-优化 wx.request 封装的调用方式
- 19-为 wx.request.封装扩展快捷方法的功能
4-3 首页布局和交互
- 01-简单介绍首页面的功能情况
- 02-熟悉首页广告的布局及交互
- 03-实现首页广告的功能
- 04-熟悉前台类目的布局及交互
- 05-实现前台类目的功能
- 06-熟悉人气推荐的布局
- 07-实现人气推荐的功能
- 08-处理并发请求
- 09-熟悉新鲜好物的布局及功能
- 10-实现新鲜好物的功能
- 11-优化商品价格的展示方式
- 12-熟悉猜你喜欢的布局
- 13-获取猜你喜欢的数据并渲染
- 14-分页加载猜你喜欢的数据
- 15-阻止无效的分页数据请求-1
- 16-阻止无效的分页数据请求-2
- 01-实现下拉刷新功能
4-4 推荐列表功能
- 02-介绍推荐列表功能
- 03-封装推荐列表中接口调用的方式
- 04-推荐列表基本数据渲染
- 05-推荐列表商品价格展示处理
- 06-推荐列表Tab交互-1
- 07-推荐列表Tab交互-2
- 08-推荐列表滚动位置-1
- 09-推荐列表滚动动位置-2
- 10-推荐列表滚动位置-3
- 11-推荐列表滚动位置-4
- 12-推荐列表滚动位置-5
- 13-推荐列表上拉分页加载-1
- 14-推荐列表上拉分页加载-2
- 15-推荐列表上拉分页加载-3
- 16-推荐列表上拉分页加载-4
- 17-推荐列表上拉分页加载-5
4-5 商品分类
- 01-商品分类的功能情况介绍
- 02-商品分类广告位功能
- 03-商品分类一级类目
- 04-商品分类二级类目
- 05-商品分类一级类目默认状态
- 06-商品分类二级类目数据缓存
- 07-商品分类二级类目滚动位置
4-6 用户管理
- 08-用户管理功能情况介绍
- 09-用户管理微信登录&注册介绍
- 10-用户管理获取微信用户手机号
- 11-用户管理获取微信用户手机号注意事项
- 12-用户管理获取微信用户信息
- 13-用户管理获取用户信息注意事项
- 14-用户管理小程序登录介绍
- 15-用户管理手机号码实现微信登录
- 16-用户管理记录用户信息和登录状态
- 17-用户管理用户信息实现微信登录
- 18-用户管理非认证小程序微信登录
4-7 用户管理个人信息展示和更新
- 01-用户管理个人信息展示-1
- 02-用户管理个人信息展示-2
- 03-用户管理个个信息展示bug修复
- 04-用户管理调用接口读取原始个人信息
- 05-用户管理渲染个人信息原始数据
- 06-用户管理更新用户头像-1
- 07-http模块扩展文件上传的功能
- 08-用户管理更新用户头像-2
- 09-http模块扩展文件上传功能完善
- 10-用户管理更新个人信息-1
- 11-用户管理更新个人信息-2
- 12-用户管理表单数据验证-1
- 13-封装表单验证工具方法-1
- 14-封装表单验证工具方法-2
- 15-用户管理表单数据验证-2
- 16-用户管理更新头像昵称和切换账号
4-8 地址管理
- 01-地址管理功能性况介绍
- 02-地址管理新建地址获取表单数据
- 03-地理管理验证表单数据-1
- 04-地址管理验证表单数据-2
- 05-地址管理验证表单数据-3
- 06-地址管理新建地址
- 07-地址管理地址列表
- 08-WeUI组件库介绍
- 09-WeUI 组件库slideView组件使用说明
- 10-地址管理删除地址
- 11-地址管理修复默认地址的数据错误的bug
- 12-地址管理优化空白内容提示功能
- 13-地址管理修改地址-1
- 14-地址管理修改地址-2
4-9 商品详情（一）
- 01-商品详情功能情况介绍
- 02-商品详情分析页面布局
- 03-商品详情基本数据渲染-1
- 04-商品详情基本数据渲染bug解释
- 05-商品详情基本数据渲染-2
- 06-商品详情Tab切换交互处理-1
- 07-商品详情Tab切换交互处理-2
- 08-商品详情页内导航交互处理-1
- 09-商品详情基本数据渲染bug修复
- 10-商品详情页内导航交互处理-2
- 11-商品详情页内导航交互处理-3
- 12-商品详情页内导航交互处理-4
- 13-商品详情推荐商品功能
- 14-商品详情配送地址-1
- 15-商品详情配送地址-2
4-10 商品详情（二）
- 01-商品详情配送地址-3
- 02-商品详情配送地址-4
- 03-商品详情配送地址-5
- 04-商品详情-配送地址-6
- 05-商品详情配送地址-7
- 06-商品详情配送地址（bug修复）
- 07-商品详情商品库存交互说明
- 08-商品详情商品库存数据渲染-1
- 09-商品详情商品库存数据渲染-2
- 10-商品详情商品规格选中状态-1
- 11-商品详情商品规格选中状态-2
- 12-商品详情商品规格切换图片
- 13-商品详情商品规格型号结果展示-1
- 14-商品详情商品规格型号结果展示-2
- 15-商品详情规格型号结果展示-3
- 16-商品详情规格型号结果展示bug修复
4-11 商品详情检测库存量
- 01-商品详情检测库存-SKU介绍
- 02-商品详情检测库存-数据结构-1
- 03-商品详情检测库存-数据结构-2
- 04-商品详情检测库存数据结构-3
- 05-商品详情检测库存量-算法分析-1
- 06-商品详情检测库存量-算法分析-2
- 07-商品详情检测库存量-算法分析-3
- 08-商品详情检测库存量-算法分析4
- 09-商品详情检测库存量-算法分析-5
- 10-商品详情检测库存量-算法分析-6
- 11-商品详情检测库存量-算法分析-7
- 12-商品详情检测库存量-算法分析-8
- 13-商品详情检测库存量-算法分析-9
- 14-商品详情检测库存量-算法分析-10
- 15-商品详情检测库存量-数据渲染
4-12 购物车功能
- 01-购物车功能介绍
- 02-购物车修改商品数量
- 03-购物车数据验证
- 04-购物车登录验证
- 05-购物车添加购物车-1
- 06-购物车添加购物车-2
- 07-购物车查询购物车-1
- 08-购物车查询购车-2
- 09-购物车查询购物车-3
- 10-购物车查询购物车-4
- 11-购物车删除购物车
- 12-购物车修改商品数量-1
- 13-购物车修改商品数量-2
- 14-购物车修改商品数量-3
4-13 订单管理（一）
- 01-购物车选中&反选商品-1
- 02-购物车选中&反选商品-2
- 03-购物车全选商品-1
- 04-购物车全选商品-2
- 05-购物车全选商品-3
- 06-购物车计算总金额
- 07-订单管理功能介绍
- 08-订单管理订单信息（去结算）-1
- 09-订单管理订单信息（去结算）-2
- 10-订单管理订单信息（立即购买）-1
- 11-订单管理订单信息（立即购买-2）
- 12-订单管理订单信息（立即购买）-3
- 13-订单管理订单信息（立即购买-4）
- 14-订单管理变更收货地址-1
- 15-订单管理变更收货地址-2
4-14 订单管理（二）
- 01-订单管理获取请求参数
- 02-订单管理创建订单
- 03-订单管理订单详情-1
- 04-订单管理订单详情-2
- 05-订单管理订单详情-3
- 06-订单管理订单详情-4
- 07-订单管理订单列表Tab交互
- 08-订单管理获订单列表数据
- 09-订单管理订单列表数据渲染-1
- 10-订单管理订单列表数据渲染-2
- 11-订单管理分页加载-1
- 12-订单管理分页加载-2
- 13-订单管理分页加载-2
- 14-订单管理分页加载-3
阶段三 前端工程化
展开第一章 webpack核心
1-1 前端工程化介绍
- 0-包管理工具PNPM介绍
- 1-课程介绍
- 2-工程化介绍
- 3-前端工程化介绍
- 4-前端工程化工具
1-2 webpack基础
- 5-Webpack 进阶介绍
- 6-webpack基础：软件安装
- 7-webpack基础：简单示例
- 8-webpack基础：处理 css 样式
- 9-webpack基础：将样式提取到独立文件
- 10-webpack基础：处理 lesssass 样式
- 11-webpack基础：处理图片和字体
- 12-webpack基础：处理 ES6 语法
- 13-webpack基础：处理 html 文件
- 14-webpack基础：处理 img引用的图片
- 15-webpack基础：使用开发服务器
- 16-webpack基础：生成调试文件
- 17-webpack基础：清理打包目录
- 18-webpack基础：打包多页应用
1-3 webpack高级配置
- 1-复习
- 2-大数据看板webpack改造
- 3-搭建基本骨架
- 4-处理 Vue 单文件组件
- 5-集成 VueRouter
- 6-集成 Vuex
- 7-拆分配置文件
- 8-解决跨域问题
- 9-定义环境变量
- 10-设置路径别名
- 11-生命周期钩子介绍
- 12-开发自定义 Loader
- 13-开发自定义 Plugin
1-4 webpack性能优化
- 1-复习回顾
- 2-摇树优化
- 3-作用域提升
- 4-添加css前缀
- 5-压缩css
- 6-抽取公共模块
- 7-按需加载
- 8-忽略解析第三方库
- 9-排除不需要打包的文件
- 10-并行打包
- 11-利用浏览器缓存
- 12-优化分析工具
- 13-预加载与预拉取
1-5 基于webpack+Vue开发管理后台
- 0-前提介绍
- 1-迁移vue-cli项目到自己搭建的骨架
- 2-获取当前项目指标
- 3-压缩css
- 4-为js和css文件添加hash
- 5-抽取公共模块
- 6-添加样式前缀
- 7-使用cdn
- 8-启用预拉取
1-6 基于webpack开发自定义CLI
- 9-何时需要自定义CLI
- 10-webpack结构
- 11-一个简单的CLI程序
- 12-标准体验的CLI程序
- 13-简易版vue-cli：代码生成
- 14-简易版vue-cli：启动开发服务器
- 15-使用npm link将cli程序全局安装
- 16-简易版vue-cli：项目打包
- 17-发布到npmjs网站
第二章 代码检查
2-1 ESLint
- 1-eslint的安装和基本使用
- 2-eslint和webpack集成
- 3-介绍 ESLint 的配置文件
- 4-禁用 ESLint 检查规则
- 5-自定义 ESLint 检查规则
2-2 stylelint
- 6-安装 StyleLint
- 7-在 webpack 中集成 StyleLint
- 8-介绍 StyleLint 的配置文件
- 9-禁用或修改 StyleLint 检查规则
2-3 在Vue-CLI中的配置
- 10-在 Vue-CLI 项目中配置 ESLint
- 11-在 Vue-CLI 项目中配置 StyleLint
- 12-提交代码时触发风格检查
第三章 git flow 全流程
3-1 Git
- 1-Git介绍
- 2-仓库初始化
- 3-将工作区文件移入暂存区
- 4-查看文件状态
- 5-将暂存区文件移入仓库区
- 6-查看提交的历史记录
- 7-将版本回退至某个提交
- 8-创建分支
- 9-查看分支
- 10-切换分支
- 11-创建并切换到新分支
- 12-删除分支
- 13-合并分支
- 14-创建标签
- 15-关联本地仓库和远程仓库
- 16-上传本地代码到远程仓库
- 17-克隆代码
- 18-获取分支的最新代码
3-2 git flow
- 19-gitflow介绍
- 20-gitflow操作流程-1-准备工作
- 21-gitflow操作流程-2-开始开发一个新功能
- 22-gitflow操作流程-3-提交一个新功能
- 23-gitflow操作流程-4-代码发布到测试环境
- 24-gitflow操作流程-5-代码发布到生产环境
- 25-gitflow操作流程-6-生产环境的bug修改
第四章 单元测试和自动化部署
4-1 单元测试
- 1-软件测试和自动化测试介绍
- 2-前端自动化测试框架
- 3-使用Jest编写单元测试
- 4-使用Jest编写单元测试-针对ES6模块代码的测试
- 5-统计测试覆盖率
- 6-使用Jest测试异步代码
- 7-使用Cypress进行e2e测试-安装和启动
- 8-使用Cypress进行e2e测试-编写和运行测试用例
- 9-Vue项目的测试：介绍
- 10-Vue项目的测试：测试组件-项目功能代码准备
- 11-Vue项目的测试：测试组件-编写组件单元测试
- 12-Vue项目的测试：测试组件-测试组件中的交互行为
- 13-Vue项目的测试：测试组件-从组件渲染后的内容中取值比对
- 14-Vue项目的测试：e2e测试
4-2 自动化部署
- 1-企业部署环境介绍
- 2-登录服务器：常规登录
- 3-登录服务器：免密登录配置
- 4-Linux 目录结构
- 5-Linux 常用命令-文件和文件夹操作
- 6-Linux 常用命令-命令行文件编辑器VI
- 7-通过 Nginx 托管前端代码
- 8-上传本地代码到服务器
- 9-全自动构建部署：Jenkins安装
- 10-全自动构建部署：配置Jenkins打包前端项目的工具
- 11-全自动构建部署：实现自动从Git拉取代码
- 12-全自动构建部署：打包构建
- 13-全自动构建部署：上传部署
阶段四 前端服务化
展开第一章 Koa基础
1-1 koa2介绍和环境搭建
- 01-koa介绍
- 02-nodejs环境安装
- 03-创建helloworld应用程序
1-2 koa2开发web应用基础
- 04-Koa中处理get请求
- 05-Koa中别名声明的说明
- 06-Koa中处理post请求-监听data和end事件
- 07-Koa中针对post请求的字符串参数做处理
- 08-Koa中响应一个页面-1
- 09-Koa中响应一个页面-2
- 10-Koa中处理静态资源
1-3 koa2中间件使用
- 11-Koa中间件的理解
- 12-Koa中间件-洋葱圈模型
- 13-Koa洋葱圈-设计理解
- 14-使用koa-body中间件-处理post传参
- 15-使用koa-views和ejs模板引擎渲染页面
- 16-使用koa-static处理静态资源
- 17-使用koa-body文件上传-明确需求
- 18-使用koa-body文件上传-基本接口
- 19-使用koa-body文件上传-功能实现
- 20-使用koa-body-实现登录接口
- 21-使用koa-router配置路由
- 22-使用koa-router配置路由模块-拆分模块
- 23-Koa基础总结
第二章 NoSQL
2-1 NoSQL概念阐述
- 01-关系型数据库
- 02-非关系型数据库
- 03-非关系型数据库的分类
2-2 在koa中使用Redis
- 04-Redis和Mongodb的介绍
- 05-Redis的基本使用
- 06-结合Koa使用Redis缓存数据(1)
- 07-结合Koa使用Redis缓存数据(2)
2-3 在Koa中使用MongoDB
- 08-MongoDB的安装
- 09-MongoShell操作数据库
- 10-MongoDB的基本概念
- 11-MongoDB基本概念-数据库相关
- 12-MongoDB基本概念-集合相关
- 13-MongoDB基本概念-文档相关
- 14-MongoDB-可视化操作工具
- 15-MongoDB-增删改查-增加
- 16-MongoDB-增删改查-查询
- 17-MongoDB-增删改查-修改和删除
- 18-准备Koa路由环境
- 19-Koa-操作MongoDB-准备db模块
- 20-Koa-操作MongoDB-查询操作
- 21-Koa-操作MongoDB-增删改查演示
- 22-Koa-配置用户名和密码-进行认证登录
- 23-总结
第三章 Koa进阶
3-1 后端项目-项目起步（博客系统）
- 01-项目介绍-博客系统
- 02-后端项目-项目起步-初始化后端项目
- 03-后端项目-项目起步-创建路由管理模块
- 04-后端项目-项目起步-创建数据库模块和中间件
- 05-后端项目-项目起步-托管静态资源
- 06-后端项目-项目起步-处理跨域请求
- 07-后端项目-项目起步-处理程序异常
- 08-后端项目-项目起步-校验接口参数
- 09-后端项目-项目起步-自动重启服务
3-2 后端项目-数据库和接口设计
- 10-后端项目-数据库设计-4个表
- 11-后端项目-接口设计-16个接口
3-3 后端项目-注册和登录
- 12-后端项目-注册登录-实现注册接口-1-构建架子
- 13-后端项目-注册登录-实现注册接口-2-postman测试说明
- 14-后端项目-注册登录-实现注册接口-3-注册service封装
- 15-后端项目-注册登录-实现注册接口-4-检查用户名是否存在
- 16-后端项目-注册登录-实现注册接口-5-注册功能完成
- 17-后端项目-注册登录-实现图形验证码接口-1-配置captcha过期字段
- 18-后端项目-注册登录-实现图形验证码接口-2-准备架子
- 19-后端项目-注册登录-实现图形验证码接口-3-生成svg验证码
- 20-后端项目-注册登录-实现图形验证码接口-4-base64处理
- 21-后端项目-注册登录-实现登录接口-1-准备登录架子
- 22-后端项目-注册登录-实现登录接口-2-处理验证码校验
- 23-后端项目-注册登录-实现登录接口-3-密码校验生成Token
- 24-后端项目-注册登录-实现接口鉴权
3-4 后端项目-通用接口
- 25-后端项目-通用接口-为文章分类表初始化数据
- 26-后端项目-通用接口-实现获取所有分类接口
- 27-后端项目-通用接口-实现图片上传接口
3-5 后端项目-文章管理
- 28-后端项目-文章管理-实现新建文章接口-1-构建新建架子
- 29-后端项目-文章管理-实现新建文章接口-2-新增完成
- 30-后端项目-文章管理-实现文章分页查询-1-构建分页架子
- 31-后端项目-文章管理-实现文章分页查询-2-基本分页
- 32-后端项目-文章管理-实现文章分页查询-3-联表查询
- 33-后端项目-文章管理-实现文章分页查询-4-过滤条件处理
- 34-后端项目-文章管理-实现文章详情接口
- 35-后端项目-文章管理-实现删除文章接口
- 36-后端项目-文章管理-实现编辑文章接口
3-6 后端项目-个人信息
- 37-后端项目-个人信息-实现个人资料查询接口
- 38-后端项目-个人信息-实现个人资料修改接口
- 39-后端项目-个人信息-实现修改密码接口
- 40-后端项目-个人信息-实现修改头像接口
3-7 后端项目-博客页面
- 41-后端项目-博客页面-分类获取文章接口-1-构建架子
- 42-后端项目-博客页面-分类获取文章接口-2-分页完成
- 43-后端项目-博客页面-分类获取文章接口-3-联表查询
- 44-后端项目-博客页面-文章详情接口
- 45-后端项目-总结
3-8 前端项目-项目起步（博客系统）
- 01-前端项目-内容介绍
- 02-前端项目-项目起步-Vite初始化项目
- 03-前端项目-项目起步-安装sass_安装element-plus
- 04-前端项目-项目起步-插件安装-volar
- 05-前端项目-项目起步-Vue3-setup-scripts 中注册事件
- 06-前端项目-项目起步-配置element-plus中文
- 07-前端项目-项目起步-构建路由模块
- 08-前端项目-项目起步-创建公用布局
- 09-前端项目-项目起步-准备基础路由
- 10-前端项目-项目起步-配置路径别名
- 11-前端项目-项目起步-构建全局状态管理器Vuex
- 12-前端项目-项目起步-封装网络请求库axios-基本代码
- 13-前端项目-项目起步-封装网络请求库axios-二次封装
3-9 前端项目-注册和登录
- 14-前端项目-注册登录-注册布局-封装注册接口
- 15-前端项目-注册登录-用户注册完成
- 16-前端项目-注册登录-登录布局-图片验证码
- 17-前端项目-注册登录-抽出图形验证码逻辑
- 18-前端项目-注册登录-用户登录-封装登录接口
- 19-前端项目-注册登录-用户登录完成
- 20-前端项目-注册登录-后台页面访问控制-获取个人信息处理
- 21-前端项目-注册登录-后台页面访问控制-功能完成
- 22-前端项目-注册登录-后台页面访问控制-测试效果
- 23-前端项目-注册登录-后台页面访问控制-添加token过期处理
3-10 前端项目-封装布局
- 24-前端项目-封装布局-页面顶部页头组件-基本结构
- 25-前端项目-封装布局-页面顶部页头组件-头像处理
- 26-前端项目-封装布局-页面顶部页头组件-下拉菜单处理
- 27-前端项目-封装布局-后台菜单栏组件
3-11 前端项目-文章管理
- 28-前端项目-文章管理-封装文章列表接口
- 29-前端项目-文章管理-渲染文章列表数据
- 30-前端项目-文章管理-实现日期格式化
- 31-前端项目-文章管理-实现分页效果
- 32-前端项目-文章管理-选择文章分类
- 33-前端项目-文章管理-实现搜索功能
- 34-前端项目-文章管理-新增和编辑-封装三个接口
- 35-前端项目-文章管理-创建弹框组件-显示弹框
- 36-前端项目-文章管理-创建弹框组件-关闭弹框
- 37-前端项目-文章管理-创建弹框组件-表单绑定
- 38-前端项目-文章管理-创建弹框组件-富文本编辑器
- 39-前端项目-文章管理-编辑回显
- 40-前端项目-文章管理-文章新增和编辑完成
- 41-前端项目-文章管理-文章图片上传
- 42-前端项目-文章管理-文章删除
3-12 前端项目-个人信息
- 43-前端项目-个人信息-个人资料展示-准备文件上传组件
- 44-前端项目-个人信息-修改个人头像
- 45-前端项目-个人信息-修改个人基本资料-显示弹框
- 46-前端项目-个人信息-修改个人基本资料-修改完成
- 47-前端项目-个人信息-修改登录密码
3-13 前端项目-博客首页
- 48-前端项目-博客首页-基本渲染首页(作业)
- 49-前端项目-博客首页-分页和实现详情页(作业)
- 50-总结
第四章 Egg.js入门
4-1 Egg基本介绍
- 01-基本介绍-Egg简介
- 02-基本介绍-创建Egg项目
- 03-基本介绍-MVC思想
4-2 Egg.js路由规则+controller+server的使用
- 04-路由Router-基本使用
- 05-路由Router-定义的详细说明
- 06-控制器controller-的作用
- 07-控制器controller-基本创建
- 08-控制器controller-查询字符串和动态路由参数解析
- 09-控制器controller-请求体参数解析
- 10-服务Service-简介
- 11-服务Service-服务的创建
- 12-服务Service-服务的调用
4-3 egg-mysql数据持久化
- 13-egg-mysql操作数据库-连接
- 14-egg-mysql操作数据库-新增
- 15-egg-mysql操作数据库-查询
- 16-egg-mysql操作数据库-查询-查询一条
- 17-egg-mysql操作数据库-查询-查询多条
- 18-egg-mysql操作数据库-修改
- 19-egg-mysql操作数据库-删除
4-4 egg-sequelize数据模型操作
- 20-egg-sequelize操作数据库-介绍
- 21-egg-sequelize操作数据库-准备
- 22-egg-sequelize操作数据库-定义模型
- 23-egg-sequelize操作数据库-新增
- 24-egg-sequelize操作数据库-修改
- 25-egg-sequelize操作数据库-删除
- 26-egg-sequelize操作数据库-查询
4-5 Egg.js的多进程模式
- 27-多进程模型-Cluster 的概念
- 28-多进程模型-Egg 框架的多进程模型
- 29-多进程模型-进程间通信IPC
第五章 Node中间层
5-1 中间层介绍
- 01-中间层概念介绍
- 02-NodeJS作为中间层的优点
5-2 基于Egg.js搭建中间层项目
- 03-基于 Egg 搭建中间层项目
- 04-在服务端使用 axios 发送请求
- 05-前端访问接口-动态渲染数据
- 06-在Egg中使用EJS 演示
- 07-在Egg中使用EJS渲染页面
5-3 小兔鲜儿首页渲染
- 08-小兔鲜首页-项目搭建和基础准备
- 09-小兔鲜首页-顶部底栏和头部导航栏
- 10-小兔鲜首页-分类目录
- 11-小兔鲜首页-轮播图
- 12-小兔鲜首页-其他模块-快速完成
- 13-小兔鲜首页-封装service优化
- 14-小兔鲜首页-封装service优化2
- 15-小兔先首页-动态渲染完成
第六章 SSR
6-1 服务端渲染介绍
- 01-什么是服务端渲染
- 02-什么是预渲染
6-2 vue的服务端渲染
- 03-服务端渲染Vue实例
- 04-服务端渲染Vue实例和Web服务器集成
- 05-使用页面模板
- 06-使用页面模板-解析变量
- 07-通用代码的说明-工厂函数避免状态单例问题
- 08-约定webpack项目结构
- 09-编写通用入口
- 10-使用webpack构建通用代码
- 11-编写web服务器启动项目
- 12-路由管理器的配置
- 13-配置vuex状态管理器
- 14-在组件中使用数据预取
- 15-服务端处理asyncData
- 16-客户端处理asyncData
6-3 Nuxt.js
- 17-Nuxt简介
- 18-项目介绍
- 19-创建Nuxt项目
- 20-Nuxt目录的使用基本说明
- 21-静态资源准备
- 22-添加less支持-配置全局变量
- 23-配置公共全局样式
- 24-新建layouts目录提供架子
- 25-layout组件编写构建完成
- 26-专题页准备页面和组件
- 27-构建专题分类和热门专题组件
- 28-调用API获取专题列表数据
- 29-父传子-动态渲染列表数据
- 30-分页组件封装-分析处理props传值
- 31-分页组件封装-动态计算总页数-按钮列表-起始和结束页码
- 32-分页组件封装-动态解析渲染按钮
- 33-分页组件封装-第一轮处理-理想情况(前后不溢出)
- 34-分页组件封装-分页处理渲染完成-处理溢出情况
- 35-分页组件封装-处理点击事件
- 36-分页效果完成
- 37-利用Vuex调用API-获取渲染专题分类
- 38-利用Vuex调用API-渲染热门专题数据
- 39-配置动态路由以及动态路由参数获取
- 40-小结
第七章 前端监控
7-1 sentry前端错误监控
- 01-前端错误监控
- 02-Sentry介绍
- 03-Sentry服务端的搭建-安装docker
- 04-Sentry服务器的搭建-安装Sentry-服务端
- 05-Sentry服务器的搭建-安装Sentry-windows环境配置
- 06-Sentry服务器的搭建-构建完成
- 07-Sentry创建Vue监控项目
- 08-Sentry监控Vue组件错误
- 09-Sentry监控Vue组件错误-补充-控制台查看错误信息
- 10-Sentry监控Vue中的请求错误
- 11-Sentry精准错误定位-创建token令牌
- 12-Sentry精准错误定位-打包上传source-map
- 13-Sentry精准错误定位-错误定位演示完成
- 14-Sentry-小结
第八章 Serverless
8-1 Severless基本使用方法
- 01-serverless-无服务器
- 02-函数即服务-Faas
- 03-腾讯云Serverless
- 04-Serverless Framework命令行工具安装
- 05-使用命令行工具-部署云函数
- 06-使用控制台页面-部署一个koa应用
- 07-部署一个静态网站
8-2 全栈网站【项目】
- 08-全栈网站-初始化-主项目
- 09-全栈网站-初始化-前端子项目
- 10-全栈网站-初始化-数据库子项目
- 11-全栈网站-初始化-后端子项目
- 12-全栈网站-数据库API的说明
- 13-全栈网站-后端-连接数据库API
- 14-全栈网站-后端-测试数据库连接
- 15-全栈网站-后端-部署基本的API架子
- 16-全栈网站-后端-远程编辑调试问题
- 17-全栈网站-后端-新增API完成
- 18-全栈网站-后端-删除API完成
- 19-全栈网站-后端-修改API完成
- 20-全栈网站-后端-查询API完成
- 21-全栈网站-前端-依赖安装-配置请求模块
- 22-全栈网站-前端-api模块封装测试
- 23-全栈网站-前端-构建静态界面
- 24-全栈网站-前端-数据列表渲染
- 25-全栈网站-前端-分页实现
- 26-全栈网站-前端-新增功能实现
- 27-全栈网站-前端-编辑功能实现
- 28-全栈网站-前端-删除完成
- 29-全栈网站-总结