今天我們來用 Koa 建立一個簡單的網頁伺服器。

Koa?

Koa 與 Express 同為 Node.js 的網頁伺服器 Package。
兩個都是非常好的網頁伺服器，但因為兩者出現的時期不同，所以概念上也有點差異。

Express 出現的比較早，當時的 JavaScript 沒有好控制的非同步，所以它的架構是線性的。
而 Koa 的時候就有了 Promise，後面更有 async/await，因此，它的架構是洋蔥狀。

但其實我很少用 Express，所以跟它也不熟。

npm i koa

最基本的架構

除了建立專案、初始化專案外，我們只需要寫下面這段程式就建構好一個最基礎的伺服器了。

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

app.use(async (ctx, next) => {
    ctx.body = "Hello, World!\n";
    ctx.type = "text/plain";
    await next(); // 這裡沒有 Next 也沒差，因為只有一個 Middleware
});

app.listen(80);

這樣我們的伺服器就會跑在 PORT 80 (HTTP) 上面了。
然後它會回傳一個簡單的 Hello, World!。

Koa Router

Koa Router 是一個很好用的工具，先用它建立一個路由表後，再讓 Koa 照著路由表處理請求。

npm i koa-router

const Koa = require("koa");
const Router = require("koa-router");

const app = new Koa();
const router = new Router();

// 建立路由表的規則
router.get("/", async (ctx, next) => {
    ctx.body = "Hello, World!\n";
    ctx.type = "text/plain";
    await next();
});

router.get("/about", async (ctx, next) => {
    ctx.body = "I am (Koa + Router)!\n";
    ctx.type = "text/plain";
    await next();
});

// 讓 Koa 使用我們建立的路由表
app.use(router.routes());
app.listen(80);

這樣我們的 Server 就會有兩種結果：

• GET 請求到 / 回傳 Hello, World!
• GET 請求到 /about 回傳 I am (Koa + Router)!

Koa Static

剛剛說的 Router 很適合作為動態產生內容的東西，就跟之前寫的 Worker 裡面用的 itty-router 很像。
但有時候我們只是要 Serve 一個資料夾內所有的靜態檔案，我們就可以用 Koa-Static 來幫我們處理。

npm i koa-static

const Koa = require("koa");
const app = new Koa();
app.use(require("koa-static")("dist"));
app.listen(80);

上面這 4 行程式就可以建立一個以 dist 資料夾為根目錄的網頁伺服器了。

或者是只寫一行...

(new (require("koa"))()).use(require("koa-static")("dist")).listen(80);

其他 Middlewares

Koa 還有很多其他人寫的 Middleware 可以實現不同的功能，作為一個架構，Koa 的靈活度非常高。
如何依需求選擇不同的 Middleware 或是自己寫非常重要。

接下來

應該要進入最後一個部份了：應用程式打包。

每日鐵人賽熱門 Top 10 (1006)

以 10/06 20:00 ~ 10/07 20:00 文章觀看數增加值排名

1. +212 Day-1 開始玩懷舊遊戲機的事前準備導覽篇
   • 作者： rei0
   • 系列：在新世代裡復活吧！我的童年懷舊遊戲機們！
2. +173 [Day 26] BDD - 組合技
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
3. +171 [Day 24] BDD - godog 小試身手
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
4. +169 [Day 3] SRE - Log寫好一點，對團隊好一些
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
5. +169 [Day 11] SRE - 事後檢討，拜託拜託讓我吸個經驗值
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
6. +168 [Day 4] SRE - 保持精簡的監控
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
7. +168 [Day 5] SRE - 發動事件左移之術，預視未來的機制
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
8. +166 [Day 10] SRE - ON-CALL
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
9. +163 [Day 25] BDD - godog image封裝
   • 作者： rainforest
   • 系列：Dev's Ops 啟程
10. +146 [Day 28] Gitea - 如何自簽憑證與Nginx注意
    • 作者： rainforest
    • 系列：Dev's Ops 啟程

最近榜上的有很多 DevOps 呢！