课程试听
正在播放

阶段一 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-功能实现)
第三章 React项目【该课程筹备录制中,敬请期待】

阶段二 多端跨平台

展开
第一章 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基础:处理 lesssass 样式
  • 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-全栈网站-总结