[334] React16.8+Next.js+Koa2开发Github全栈项目 - 掌握众多热门技术与业务，突破你的技术瓶颈

网盘链接：

1. 课程导学

• 1-1 课程导学

2. 项目搭建

• 2-1 关于项目所用的npm包版本号
• 2-2 创建next.js的项目
• 2-3 next作为koa中间件使用
• 2-4 koa使用方式介绍
• 2-5 redis的windows安装
• 2-6 redis的mac安装
• 2-7 redis基本使用
• 2-8 nodejs连接redis数据库
• 2-9 nextjs集成antd

3. Next.js基础

• 3-1 nextjs项目目录结构
• 3-2 页面跳转
• 3-3 动态路由
• 3-4 路由映射
• 3-5 路由变化的钩子
• 3-6 nextjs数据获取方式
• 3-7 nextjs自定义App
• 3-8 nextjs自定义Document
• 3-9 nextjs样式的定义
• 3-10 nextjs集成styled-components
• 3-11 nextjs中异步模块和组件的加载
• 3-12 nextjs中的配置项
• 3-13 nextjs服务端渲染流程深度解析

4. React新特性Hooks讲解

• 4-1 什么是Hooks
• 4-2 State-Hooks讲解
• 4-3 Effect-Hooks讲解
• 4-4 Context-Hooks讲解
• 4-5 Ref-Hook讲解
• 4-6 Hooks渲染优化
• 4-7 闭包陷阱

5. 引入Redux

• 5-1 什么是Redux
• 5-2 创建一个store
• 5-3 redux中的reducer
• 5-4 redux中的action
• 5-5 react-redux连接react和redux
• 5-6 redux-devtool的使用
• 5-7 nextjs中的HOC
• 5-8 nextjs集成redux（1）
• 5-9 nextjs集成redux（2）

6. OAuth 介绍和接入

• 6-1 认证和授权介绍
• 6-2 OAuth概述
• 6-3 code认证方式的流程
• 6-4 注册github-OAuth-App
• 6-5 OAuth的字段讲解以及流程演示
• 6-6 OAuth-code认证方式如何保证安全
• 6-7 cookie 和 session
• 6-8 创建koa-seesion的redis存储store（1）
• 6-9 创建koa-seesion的redis存储store（2）
• 6-10 接入Github-OAuth（1）
• 6-11 接入Github-OAuth（2）

7. 项目整体设计

• 7-1 项目整体需求介绍
• 7-2 页面整体布局Layout组件的开发
• 7-3 cloneElement扩展组件可复用性的高级技巧
• 7-4 服务端渲染同步用户信息
• 7-5 完善登录功能
• 7-6 用户登出功能实现
• 7-7 维持OAuth之前得页面访问
• 7-8 增加全局页面切换的Loading效果
• 7-9 Github接口代理
• 7-10 完善整体布局
• 7-11 Github接口代理完善
• 7-12 koa中处理post请求的数据

8. 首页开发

• 8-1 联调主页数据
• 8-2 展示用户数据以及用户登出时的页面内容
• 8-3 Repo组件展示基本组件内容的开发
• 8-4 tab切换展示创建的仓库和关注的仓库
• 8-5 使用缓存数据
• 8-6 使用缓存更新策略

9. 搜索页面开发

• 9-1 搜索功能概述
• 9-2 搜索接口联调以及搜索条件展示
• 9-3 搜索条件删选功能实现
• 9-4 搜索条件跳转的优化-提取组件
• 9-5 搜索结果的展示
• 9-6 处理Github搜索结果限制

10. 仓库详情页开发

• 10-1 仓库详情页面功能概述
• 10-2 仓库布局开发
• 10-3 提取布局成为一个HOC
• 10-4 仓库基础信息缓存功能的实现
• 10-5 获取markdown内容并转义
• 10-6 使用markdown-it来转换markdown
• 10-7 打包分析
• 10-8 issues页面的开发
• 10-9 创建用户搜索组件
• 10-10 完成issue搜索功能的开发
• 10-11 完善issues页面

11. 项目优化

• 11-1 nextjs静态页面导出功能
• 11-2 项目部署
• 11-3 总结