学成在线是一个在线教育的web应用平台，用户可以在线选课、购买课程、在线交流等。数据服务子系统使用Node.js + Mysql来实现网站数据的相关操作和状态管

*   第一章 学成在线项目/

  *   项目介绍/

    *   01-项目介绍以及SPA和服务端渲染

    *   02-系统开发流程介绍

  *   搭建项目结构/

    *   03-项目框架初步搭建和端口的修改

    *   04-项目集成css和less文件解析和集成antd

    *   05-重写_document.js完成antd的全部组件样式导入

    *   06-头部和底部抽离分析和代码实现

    *   07-头部和底部组件样式调整

  *   项目介绍和框架搭建/

    *   08-redux执行过程分析

    *   09-1-redux代码实现1

    *   09-2-redux代码实现2

    *   09-3-redux代码实现总结

    *   10-利用redux-persist完成将store中的state保存到localStorage中

    *   11-1- 利用fetch实现数据请求封装get方法

    *   11-2- 利用fetch实现数据请求封装post

    *   11-3- 测试封装好的fetch方法

  *   项目业务-登录/

    *   12-1-登录过程中浏览器与服务器的处理过程分析(理解Session状态管理机制)

    *   12-2- 登录功能实现1

    *   12-3- 登录功能实现2

    *   13-1登录成功跳转以及sessionStorage存储用户信息-前半部分

    *   13-2登录成功跳转以及sessionStorage存储用户信息-后半部分

    *   13-3利用antd中的表单组件实现登录页面用户名手机号码正则验证

    *   13-4 登录组件样式的两种写法演示-3

  *   注册功能/

    *   14-1注册功能分析业务分析和单独在Register实现注册页面原因

    *   14-2注册页面静态页面结构实现

    *   14-3注册页面表单元素合法性检查初步实现

    *   14-4 完成手机号码是否已经被注册业务逻辑

    *   14-5 完善手机号码是否被注册检查业务逻辑-点击注册按钮时也应该检查

    *   14-6 完成点击注册按钮业务逻辑代码

    *   14-7 完成点击获取验证码请求服务器业务代码

    *   14-8 获取验证码按钮倒计时业务实现

    *   14-9 使用antd中的表单中的自定义验证规则完成再次输入密码的一致性检查

  *   项目业务-学生端首页/

    *   15-1 学生端首页页面分析和静态结构实现

    *   15-2 学生端首页-通过getInitialProps轮播图数据并且动态渲染

    *   15-3 学生端首页-通过getInitialProps课程导航数据并且动态渲染

    *   15-4 学生端首页-通过componentWillMount实现精品课程的数据获取和渲染

    *   15-5 学生端首页-通过componentWillMount实现不同课程分组的数据获取和渲染

    *   15-6 学生端首页- 实现课程标签的动态化和修复map遍历时报没有定义key的错误

  *   项目业务-学生端详情页/

    *   16-1 学生端课程详情页面实现思路分析

    *   16-2 学生端课程详情页中利用withRouter实现url传参值的获取

    *   16-3 学生端课程详情页面静态结构实现（使用了antd中的Tab组件

    *   16-4 学生端课程详情页顶部数据获取（使用getInitialProps方式）

    *   16-5 学生端课程详情页课程详情、常见问题、授课老师数据展示

    *   16-6 学生端课程详情页课程大纲实现1

    *   16-6 学生端课程详情页课程大纲实现2

  *   购物车&订单确认&支付/

    *   17-1 分析购物车实现业务以及加入购物车按钮实现思路

    *   17-2 实现加入购物车按钮功能1

    *   17-2 实现加入购物车按钮功能2

    *   17-2 实现加入购物车按钮功能3

    *   17-3 实现购物车列表数据展示

    *   17-3-1 实现购物车列表数据删除

    *   17-3-2 实现购物车列表勾选商品总价格计算和控制结算按钮是否可用

    *   17-4-1 分析订单确认和下单操作业务

    *   17-4-2 将用户勾选购物车中的课程数据使用redux管理起来

    *   17-4-3 实现订单确认页面业务代码

    *   17-4-4 分析和实现订单确认页面中的下单按钮逻辑

    *   17-4-5 分析支付页面要实现的业务和数据来源以及接口调用

    *   17-4-6 实现支付页面支付链接的二维码生成

    *   17-4-7 支付页面使用定时器进行支付状态检查

  *   个人中心/

    *   18-1 完成我的订单页面数据动态化

    *   18-2 修复我的订单上数据展示

    *   18-3 完成筛选订单数据功能

    *   18-4 完成订单数据分页功能

    *   18-5 完成我的课程页面功能

  *   完善课程详情页面/

    *   19 完善课程详情页面免费和收费课程播放权限的控制

  *   播放页面/

    *   20-1 视频播放页面业务分析和页面静态结构创建

    *   20-2 利用Router对象实现detial页面中的章节跳转功能

    *   20-3 完成视频播放页面登录判断业务代码

    *   20-4 完成视频播放页面视频源，代码，资源下载业务代码

    *   20-5 完成视频播放页面章节树业务代码

    *   20-6-1 完成视频播放章节问答业务分析和列表数据获取

    *   20-6-2 完成分页获取问答列表功能

    *   20-6-3 完成问题提交和回答功能

  *   后台管理系统/

    *   21-1 后台管理系统业务分析和布局组件加载实现思路分析

    *   21-2 实现后台管理系统布局组件代码实现

    *   21-3 实现课程列表数据动态化和分页功能

    *   21-4 实现课程列表条件筛选功能

    *   21-5 实现新增页面静态结构和富文本编辑器的使用

    *   21-6 利用TreeSelect组件实现新增课程页面中的课程分类树型数据展示

    *   21-7 实现课程新增页面图片的上传功能

    *   21-8 完成新增课程post数据功能

    *   21-9 实现课程大纲树形表格功能

    *   21-10 优化章节列表功能

    *   21-11 实现新增一级大纲和二级大纲功能

    *   21-12 完成大纲数据编辑功能

    *   21-13 在头部组件中增加后台管理入口

    *   21-14 next.js项目的发布演示和完整代码和文档地址说明