【WEB前端】Koa2框架从0开始构建预告片网站

〖课程介绍〗:

随着 ES6/7 的普及推广，Koa2 框架也逐步走入大小公司一线工程师的视野，作为即将在前端工作中占据一席之地的框架，Koa2 学习势在必行。这一次 Scott 老师通过完整的网站项目，以及足够篇幅的源码解读，为你讲解 Koa2 框架的原理、实战项目中的作用，以及与其他三方库框架的结合使用姿势，小伙伴们不要错过哦！

【WEB前端】Koa2框架从0开始构建预告片网站

〖课程目录〗:

第1章 2018 年的编程姿势4 节 | 30分钟
2018 年， Nodejs 版本如何跟进，Promise 要不要用，Async Function 如果使用，通过 Babel 如何编译，代码风格总是没有事实标准，激进的换成 Standard 会不会更清爽。
收起列表

视频：1-1 koa2导学 (07:21)
视频：1-2 安装跟进最新的 Node.js 版本 (07:30)
视频：1-3 毫不犹豫的使用 Promise（callback到Promise再到Promisify） (10:12)
视频：1-4 使用 Babel 编译 ES7 Async Function (04:01)

第2章必会 ES6-7 语法特性与规范6 节 | 69分钟
ES6/7/8 时代到来，重要的语法特性，如 Generator Function 与迭代器的关系，如何通过 co 来执行 Promise 和 Generator Function，箭头函数的常见用法，import 和 export 如果使用 Babel 如何进行编译，如何在生产环境进行编译构建。
收起列表

视频：2-1 生成器函数 Generator Function (11:10)
视频：2-2 co 库执行 Promise 和 Generator Function (13:00)
视频：2-3 箭头函数 Arrow Function (08:55)
视频：2-4 异步函数 Async Function 统一世界 (10:29)
视频：2-5 借助 Babel 编译 import 与 export (17:50)
视频：2-6 生产环境使用 Babel 支持 ES6-7 (07:18)

第3章层层学习 Koa 框架的 API8 节 | 91分钟
通过一个个文件，一个模块一个模块的分解，从源代码里调出核心的代码，一层层进入去了解 koa 的核心对象、服务类、上下文对象、请求与相应对象他们的代码架构和角色构成，同时去研究 koa 核心知识点 – 中间件机制以及借助 koa-compose 而实现的魔法递归流转过程，最后学习会话和 cookie 的基础知识。…
收起列表

视频：3-1 Koa 核心对象 (08:03)
视频：3-2 Web 服务类 Application (21:15)
视频：3-3 HTTP 上下文对象 context(ctx) (11:24)
视频：3-4 HTTP 请求对象 request(req) (07:30)
视频：3-5 HTTP 响应对象 response(res) (07:18)
视频：3-6 Koa 中间件 middlewares (14:49)
视频：3-7 纯函数-尾递归与魔法大师 koa-compose (11:14)
视频：3-8 session-cookie-路由与 Koa 小结 (08:54)

第4章 Koa2 与 Koa1 、Express 框架对比4 节 | 40分钟
对比 Koa 的两个重大版本，也就是 Koa1 和 Koa2，两代版本的区别，以及其他框架如 Express 框架的架构区别和语法、用法区别。
收起列表

视频：4-1 Koa2 与 Koa1 的用法对比 (21:12)
视频：4-2 Koa 与 Express 的 API 能力对比 (05:14)
视频：4-3 Koa 与 Express 的中间件执行模型对比 (07:39)
视频：4-4 Koa2 Express 选型及小结（含奖励哦） (05:00)

第5章从 0 开发一个电影预告片网站8 节 | 114分钟
从 new Koa() 开始起一个干净的 Server 服务，来了解 Koa 简洁的请求处理流程，到可以返回一个静态 HTML 页面，到可以集成模板引擎返回动态内容，到 Bootstrap 搭建传统网站页面来学习项目从 0 到 1 的搭建流程。
收起列表

视频：5-1 设计与分析 (03:50)
视频：5-2 6 行代码撸一个服务器推到 Git 仓库 (13:11)
视频：5-3 服务器返回一个静态 HTML 页面 (13:06)
视频：5-4 增加 Pug ejs 动态模板引擎渲染 (17:26)
视频：5-5 集成模板引擎到 Koa 搭建初始模板目录 (15:02)
视频：5-6 借助 BootStrap 4-x 搭建网站首页 (20:06)
视频：5-7 关于构建工具 Parcel 解决的问题 (07:44)
视频：5-8 利用 Parcel 打包普通网站以及 React 架构网站的资源方案 (23:10)

第6章利用爬虫搞定网站基础数据7 节 | 84分钟
学习如何在 Koa 里面起多个子进程，如何子进程中跑重的脚本任务，比如通过 Google Puppeteer 无头浏览器来模拟真实用户访问，来爬取到设置过反爬机制的网页文本，以及如何通过 Koa 发起服务器端的 HTTP 请求，进而拿到图片和视频地址，最终自动的上传到七牛图床上托管以加速访问，节省带宽。…
收起列表

视频：6-1 设计与分析 (02:20)
视频：6-2 利用 puppeteer 爬取和分析电影列表 (19:29)
视频：6-3 child_process fork 子进程来运行爬虫脚本 (09:22)
视频：6-4 服务器端通过 request 向豆瓣 API 请求详细数据 (11:14)
视频：6-5 Scott 与妹子合租引发的同步异步与阻塞 (13:58)
视频：6-6 puppeteer 深度爬取封面图和视频地址 (10:30)
视频：6-7 上传线上封面图和视频搬砖到七牛云图床上 (16:55)

第7章彩蛋篇 – [高难度拔高干货] 深度理解 Node.js 异步 IO 模型5 节 | 77分钟
本篇是课程精心赠送之高难度拔高彩蛋篇，意在帮助有基础的同学进一步加深对 Node.js 底层的组成，底层的 Libuv 事件循环阶段，microtasks 事件优先级，结合大量代码案例来掌握 Node.js 核心知识 – 可以横向扩展的多进程单进程无阻塞事件驱动模型。…
收起列表

视频：7-1 Nodejs 在本期课程彩蛋知识点 (03:42)
视频：7-2 从异步非阻塞的代码案例切入事件循环 (11:17)
视频：7-3 从 libuv 源码来理解 Event Loop 的 6 个阶段 (11:27)
视频：7-4 设计一个测试用例来验证自己对事件循环的理解 (28:05)
视频：7-5 单线程多进程模型事件循环及进程通信 (21:38)

第8章实战篇 – 在 Koa 中向 MongoDB 建立数据模型8 节 | 126分钟
在 Mac/Windows/Ubuntu/Centos 上安装 MongoDB 数据库，并且在 Koa 集成 Mongoose 中间件后，为电影，分类设计 schema 来创建数据模型，以导入之前爬到的预告片数据。
收起列表

视频：8-1 Windows Mac CentOS Ubuntu 安装 MongoDB (17:21)
视频：8-2 Koa2 中利用 Mongoose 连接数据库 (13:53)
视频：8-3 MongoDB 和 Mongoose 关于 collection schema model entity 的基本概念 (04:59)
视频：8-4 利用 schema model 创建电影的数据模型 (07:26)
视频：8-5 创建用户数据模型并实现加盐加密和敏感登录控制 (25:12)
视频：8-6 创建电影分类以及初始化所有 schema (07:29)
视频：8-7 向数据库导入爬到的电影数据 (26:58)
视频：8-8 图床资源同步以及管理换账号初始化 (21:39)

第9章实战篇 – 为网站增加路由与控制器层对外提供 API 服务5 节 | 70分钟
通过在 Koa 中集成多个中间件，同时封装基于装饰器的路由组件，来提供更易于拓展的路由层级，并且实现控制器与数据服务层的分离，对外提供 API 接口服务。
收起列表

视频：9-1 [第 2 次迭代] 快速实现一个最小统计的 API 服务器 (07:05)
视频：9-2 [第 2 次迭代] 了解 Koa-router 的基本能力以及取舍套路 (10:21)
视频：9-3 [第 2 次迭代] 通过装饰器来把路由进行拆分和集成 (13:45)
视频：9-4 [第 2 次迭代] 结合 Decorator 对 koa-router 进行抽象封装支持路由空间分离 (19:04)
视频：9-5 [第 2 次迭代] 分拆项目服务层与路由层对外暴露 API 服务 (18:49)

第10章实战篇 – 集成 AntDesign 与 Parcel 打通前后端与构建4 节 | 60分钟
把 AntDesign 集成到项目中，并且把 Parcel 也集成到 Koa 的本地开发环境中，同时配置构建中间层来做到本地开发与生产环境的构建分离，让整个前后端的项目贯穿起来
收起列表

视频：10-1 [第 3 次迭代] 配置 Babel Postcss 来支持 Parcel 的打包构建 (07:57)
视频：10-2 [第 3 次迭代] 在 Koa 中集成 Parcel 开发与生产环境的构建中间件 (13:05)
视频：10-3 [第 3 次迭代] 结合 react-router-dom 与 import 来动态加载前端路由业务组件 (19:36)
视频：10-4 [第 3 次迭代] 实现网站的布局模板组件和导航菜单 (18:45)

第11章实战篇 – 实现网站前端路由与页面功能5 节 | 73分钟
以底层的 Koa 为服务底层，在上层 AntDesign 项目中开发首页、详情页、播放功能、推荐功能、筛选功能，以及路由分拆来实现网站的基础页面。
收起列表

视频：11-1 [第 4 次迭代] 基于 axios 封装可以控制 loading 前置状态的请求组件 (08:14)
视频：11-2 [第 4 次迭代] 开发网站首页电影列表 (13:07)
视频：11-3 [第 4 次迭代] 抽象网站首页电影卡片内容组件 (22:13)
视频：11-4 [第 4 次迭代] 为电影卡片增加视频播放及切换功能 (11:39)
视频：11-5 [第 4 次迭代] 开发电影详情页 (17:32)

第12章实战篇 – 实现后台登录权限与管理功能4 节 | 54分钟
实现网站的后台用户登录校验加盐与列表管理功能，同时维持用户的登录状态。
收起列表

视频：12-1 [第 5 次迭代] 实现网站的后台登录页面及密码校验 (15:48)
视频：12-2 [第 5 次迭代] 实现网站后台管理列表页 (08:06)
视频：12-3 [第 5 次迭代] 增加登录权限以及参数验证 (14:18)
视频：12-4 [第 5 次迭代] 增加用户会话保持与数据删除功能 (15:00)

第13章服务器部署与发布2 节 | 24分钟
详细讲解服务器部署与发布的相关内容。
收起列表

视频：13-1 简单配置本地与服务器的 PM2 环境及发布脚本 (12:23)
视频：13-2 服务器第一次部署与发布 (11:32)

第14章课程总结与展望1 节 | 4分钟
对 Koa2 及 Node.js 核心知识进行回顾总结，并且对 Koa3 进行展望，整理整个项目的应用场景与上线维护注意事项。
收起列表

视频：14-1 Koa2 课程回顾总结 (03:30)

有需要联系v；加客服窗口的联系方式

摘要：本文将深入探讨如何使用Koa2框架从零开始构建一个预告片网站。通过详细的步骤和代码示例，我们将一步步解析如何搭建网站架构、实现功能模块、优化性能，以及部署上线，为WEB前端开发者提供一套完整的实战指南。

1、环境搭建

在开始构建预告片网站之前，我们需要搭建一个合适的工作环境。首先，确保你的电脑上安装了Node.js和npm。接着，创建一个新的项目目录，并初始化npm项目。在这个过程中，我们将安装Koa2框架以及其他必要的依赖包，如koa-router、koa-bodyparser等。

接下来，配置项目的路由和中间件。路由用于处理客户端的请求，而中间件则用于处理请求和响应。在这个阶段，我们需要定义网站的各个功能模块，如首页、预告片列表、预告片详情等，并为它们配置相应的路由。

此外，我们还需要配置数据库连接。预告片网站通常会涉及到数据的存储和查询，因此，我们需要选择合适的数据库，如MySQL或MongoDB，并配置相应的连接信息。这样，我们就可以在网站中实现数据的增删改查操作了。

2、功能实现

在功能实现方面，我们需要关注以下几个模块：首页、预告片列表、预告片详情和搜索功能。首先，首页是网站的第一印象，我们需要设计一个简洁、美观的首页界面，并展示最新的预告片信息。

预告片列表模块用于展示所有预告片，包括预告片的封面、标题、上映时间等。在这个模块中，我们需要实现分页功能，以便用户可以浏览更多预告片。此外，我们还可以为每个预告片添加点赞、评论等功能，提高用户体验。

预告片详情模块用于展示单个预告片的详细信息，包括预告片的视频、剧情简介、演员阵容等。在这个模块中，我们需要实现视频播放功能，并确保视频流畅播放。同时，我们还可以为预告片添加收藏功能，方便用户下次观看。

3、性能优化

性能优化是构建预告片网站的重要环节。为了提高网站的性能，我们需要关注以下几个方面：代码优化、数据库优化和缓存策略。

在代码优化方面，我们需要遵循良好的编程规范，如代码复用、模块化等。此外，我们还可以使用一些性能分析工具，如Chrome DevTools，来检测和修复代码中的性能瓶颈。

在数据库优化方面，我们需要合理设计数据库表结构，并使用索引来提高查询效率。同时，我们还可以考虑使用读写分离、分库分表等技术，以减轻数据库的压力。

在缓存策略方面，我们可以使用Redis等缓存技术，将热点数据缓存起来，减少数据库的访问次数，从而提高网站的性能。

4、部署上线

完成网站开发后，我们需要将其部署上线。首先，选择一个合适的云服务器，如阿里云、腾讯云等，并配置相应的服务器环境。接着，将网站代码上传到服务器，并配置服务器上的Node.js环境和数据库连接。

在部署过程中，我们需要关注网站的访问速度和稳定性。为了提高访问速度，我们可以使用CDN技术，将静态资源（如图片、CSS、JavaScript等）缓存到全球各地的节点上。同时，我们还需要配置服务器防火墙和SSL证书，以确保网站的安全性。

最后，我们需要对网站进行持续监控和优化，以确保其稳定运行。这包括监控网站的访问量、服务器负载、数据库性能等指标，并根据实际情况进行调整。

总结：

通过本文的详细阐述，我们从环境搭建、功能实现、性能优化和部署上线等方面，全面解析了如何使用Koa2框架从0开始构建一个预告片网站。在这个过程中，我们不仅掌握了Koa2框架的使用方法，还学会了如何优化网站性能和部署上线。希望本文能为WEB前端开发者提供一套实用的实战指南。

本文由nayona.cn整理

点击联系需要东西方神秘学学习资料，专业的咨询

只要网页介绍资料，全部都有，还有很多还没来得及更新
每天更新200-300款资料
全网最大最全的神秘学资料平台
请需要什么资料，直接在对话框直接联系我，24小时在线，方便快捷
请需要什么资料，直接在对话框直接联系我，24小时在线，方便快捷
请需要什么资料，直接在对话框直接联系我，24小时在线，方便快捷
有看中网站记得联系我