实战项目：React16.8+Next.js+Koa2开发Github全栈项目

Posted 2021-04-26 黑客与编程资源库

以上资源收集至互联网

如有侵权请联系删除

资源获取方式

回复密码'20190818'

即可获得

截图展示

课程信息

课程难度：中级

学习人数：49863

课程状态：已完结

时长：六周

课程介绍

讲解 Nextjs 项目的搭建，

其中会搭建自己的服务集成 Koa，

集成 Antd 作为组件库。介绍什么是 Hooks，

基础 Hooks 的使用，包括 State Hooks，

Effect Hooks、Context Hooks 

和优化相关的 Hooks。

着重介绍 Redux 如何集成到 Nextjs 当中。

课程大纲

第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自定义Documen

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-4Context-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-Ap

6-5 OAuth的字段讲解以及流程演示

6-6 OAuth-code认证方式如何保证安

6-7 next-05-07(标记处网页字小)-cookie和session-part1_x264

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页面

10-12 仓库详情页面功能概述

第11章项目优化

11-1 nextjs静态页面导出功能

11-2 项目部署

11-3 总结

其他资源

知识星球用户领取资源入口

点击阅读原文