Koa2框架從0開始構建預告片網站

學習總結

一、課程地址：coding.imooc.com/learn/list/…。

二、1~四、7章是 node 基礎，需記於腦海。5~6章是網站項目的工程搭建和數據（使用爬蟲）準備。8~9章是 node 核心教程，須要多查資料，特別是 koa-router 的高階用法——裝飾器Decorator（沒看懂）。10~12章是項目前端網頁的內容，加速瀏覽跳過。13章是發佈腳本和部署，須要練習（能夠去 github 上找別人的模板）。

14 Koa 課程總結

一、

13 服務器部署與發佈

一、nginx：前端靜態資源（結合 cdn）、後端接口 proxy；

二、deploy.yaml：發佈腳本，使用pm2來部署。（pm2除了守護node，還能部署 node？？？）

12 實現後臺登陸權限與管理功能

一、koa-bodyparser

二、koa-logger

11 實現網站前端路由與頁面功能

一、axios：也可用在node 環境。

10 集成 AntDesign 與 Parcel 打通先後端與構建

一、前端項目建立。

二、使用 Parcel 在開發與生產環境的構建中間件：parcel-bundler

9 爲網站增長路由與控制器層對外提供 API 服務

一、

二、koa-router：

const Router = require('koa-router''); const router = new Router(); router.get('/test', async (ctx, next) => { // ... ctx.body = ...; }); router.get('/test/:id', async (ctx, next) => { // ... ctx.body = ...; }); module.exports = router; 複製代碼

import router from './routes';  // 引入上面本身實現的路由

app
    .use(router.routes())   // 加載路由
    .use(router.allowedMethods());  // 加載 router 默認的方法
複製代碼

三、url 的規則：get、post 級聯；

四、router 的使用中間件，或本身加中間件函數，參考以前學習的 next）；

五、子路由：const router = new Router({ prefix: '/test'})，省略重複書寫路由前綴 /test 方便管理；

六、裝飾器：對路由進行拆分和集成，須要安裝 babel 插件。拿到裝飾器的對象及屬性，對對象額外添加屬性能力。

七、對類進行裝飾：分配 前綴/空間。對函數進行裝飾：指定子路由的實現函數。

八、裝飾器的Decorator：（看得頭暈）

九、路由層：對外提供接口。

十、服務層：對路由層提供服務。

十一、ramda：函數式編程，減小手寫 use方式引入中間件。

8 使用 mongoose

一、config、init、connect、lister

二、mongoDB是從設計角度：document>collection>database，相似 mysql 中的 row>table>database。mongoose是從使用代碼角度的：schema、model、entity。

三、

7 深度理解Node

一、從異步非阻塞的代碼案例切入事件循環：EventEmitter：on、emit

二、從 libuv 源碼理解 event loop 的6個階段：爲何是單線程、優先級。

三、nextTick>resolve>nextTick>timers>i/o>setImmediate>timers

四、（設計一個測試用例來驗證本身對事件循環的理解）

五、

六、單線程多進程模型 事件循環及進程通訊，橫向擴展。

七、cluster模式：fork、主進程master、子進程worker。疑問：子進程執行的代碼和主進程的在一塊兒？可否指定子進程的代碼文件。

6 利用爬蟲搞定網站基礎數據

一、puppeteer：爬蟲腳本

二、child_process fork 子進程來運行腳本

三、進程的9個問題：同步異步、異步IO、阻塞非阻塞、事件循環與事件驅動、單線程、進程、子進程、進程間通訊

四、服務端經過 request 向豆瓣API請求數據：request-promise-native，將異步request轉爲同步的

五、與妹子合租引發的同步異步與阻塞：

5 從0開發一個電影預告片網站

一、npm init：初始化項目。

二、結合 bootstrap，返回 html 頁面。

三、使用 ejs：支持變量的 html 模板。

四、使用 Jade（Plug）：

五、consolidate：模板引擎整合庫。

六、koa-views：視圖管理模塊，自動引入指定目錄下的全部模板文件，同時將 render函數掛載到 ctx 上。

七、pug的繼承介紹及實例。

八、（跳過使用 pug、bootstrap 搭建靜態項目首頁）

九、構建工具Parcel：無配置、自帶默認場景、徹底傻瓜式配置。

十、koa-static：

3-7 session-cookie-路由

3-6 純函數-尾遞歸和魔法大師 koa-compose

一、純函數的概念：

二、尾遞歸：

三、koa-compose：把一個個不想幹的中間件串起來，上一個函數的輸出結果就是下一個函數的輸入參數。

3-5 Koa中間件middlewares

一、koa中，一切 use 的均是中間件！

二、中間件格式：

const mid = async (ctx, next) => {
    // 其餘代碼
    await next();   //串聯中間件
}
複製代碼

三、每次中間件執行順序，是根據 use添加的順序。

四、中間件A內部調用 await next()後，會跳轉到下一個中間件進行執行。若是沒有調用 next 則中斷後續中間件執行，而後逐級按照調用 next 的順序逆向返回以前中間件函數內部，意思是當中間件A 調用 next 後會轉到中間件B 執行，這時 B 調用 next 繼續執行後續中間件。若是後面沒有中間件了，則返回 A 繼續執行next 後的函數代碼。

五、簡單的說，next 是用來移交當前的控制權的，中間件數組是先進後出。

六、以 kog-logger 來進一步解釋 next 的原理。

3-5 HTTP響應對象response(res)

一、 res 是掛載在 ctx 對象上的，能夠經過打印 ctx 查看

3-4 HTTP請求對象request(req)

一、req 是掛載在 ctx 對象上的，能夠經過打印 ctx 查看

3-3 HTTP上下文對象context(ctx)

一、

3-2 服務類Application

一、依賴包介紹

二、use：添加自定義函數到中間件列表 middleware 中；

三、listen：建立 http 對象，並開啓監聽；

四、callback、handleRequest：收到請求後，從 middleware 中拿出自定義函數， 並將請求對象 ctx 交給自定義函數處理，等待自定義函數處理完以後，而後交回 ctx 控制權並返回 response。

五、application 的做用：接收中間件，監聽端口，接收http 請求並逐步調用中間件，最後handleResponse。

六、在網絡上找更詳細的內部流轉流程圖進行學習。

3-1 Koa核心對象

一、HTTP 接收、解析、響應：中間件、執行上下文；

二、Application：

三、Context：

四、Request：

五、Response：

六、Middlewares：

七、Session：

八、Cookie：

const Koa = require('koa');
const app = new Koa();

app.use(async (ctx, next) => {
    ctx.body = 'Hi Luke';
});

app.listen(2333);
複製代碼

2-6 生產環境使用 Babel 編譯執行代碼

一、rimraf：刪除目錄。

二、babel-plugin-transform-runtime ： babel 的編譯運行環境。

三、babel-plugin-runtime：babel 的運行環境。

四、在 .babelrc 中添加 plugin 支持。

2-5 開發環境使用 Babel 編譯 import 和 export

• require：運行時加載。
• import：靜態加載。

一、安裝 babel：yarn add -D babel-cli babel-preset-env。

二、項目根目錄新增文件.babelrc，增長對應配置項。

三、nodemon：監視node.js應用程序中的任何更改並自動重啓服務，很是適合用在開發環境中。

四、注意 default 和別名的使用技巧。

2-4 異步函數Async Function

2-3 箭頭函數

• this：箭頭函數裏的 this 是指函數定義時所在做用域的 this，而不是運行時做用域的 this。

2-2 co庫執行 promise 和 generator

• co：TJ大神的做品。

2-1 生成器函數 Generator Function

• 迭代器：關鍵點是next、done
• 生成器：簡化迭代器的建立過程，關鍵點是*和 yield。yield 是用來等待函數執行完成

1-3 推薦使用Promise

• callback：在Node中異步回調有一個約定：Error first，也就是說回調函數中的第一個參數必定要是Error對象，其他參數纔是正確時的數據。因此先判斷 error，若是沒有出錯再進行後續操做。
• promise：使用return new Promise 來取代 callback。
• promiseify：util.promisify 的那些事兒。

1-2 安裝 Node 版本

• 多用 LTS 版本，本地和服務器儘可能保持一致。
• 使用 nvm 來管理 node 版本，可在本地切換最新版本學習新特性。
• node 版本支持 ES 特性列表

•