みかづきブログ その3

3ヶ月つづけてみました。

Koaをつかってスタティックなサーバをたてる 😎

kimizuka.hatenablog.com

いままではExpressをつかっていましたが、
もう2017年なので、これからは積極的にKoaをつかっていこうと思いました。

Koaとは

Koaとは next generation web framework for node.js です。
よくわからないけど、Node.js向けの次世代のウェブフレームワークなんでしょうね。きっと。
次世代と聞くと、次世代ゲーム機と呼ばれたセガサターン並みの実力を期待してしまいますね。^ ^

Koa - next generation web framework for node.js

Node.js用のフレームワークは数あれど、
KoaはExpressの開発チームが開発しているフレームワークとの噂なので、
これを機にExpressから乗り換えてみようと思いました。

導入手順

package.jsonをつくる
yarn init -y
必要なモジュールをインストール
yarn install babel-cli
yarn install babel-preset-es2015
yarn install babel-preset-es2017
yarn install koa
yarn install koa-static-server

のちに解説で解説しますが、Expressのときよりもモジュールがたくさん必要になります。


package.jsonを編集
{
  "name": "koa-static",
  "version": "1.0.0",
  "main": "app.js",
  "license": "MIT",
  "babel": {
    "presets": [
      "es2015",
      "es2017"
    ]
  },
  "scripts": {
    "start": "babel-node app.js"
  },
  "dependencies": {
    "babel-cli": "^6.24.0",
    "babel-preset-es2015": "^6.24.0",
    "babel-preset-es2017": "^6.22.0",
    "koa": "^2.2.0",
    "koa-static-server": "^1.0.0"
  }
}
app.jsを編集
"use strict";

import Koa from "koa";
import serve from "koa-static-server";

const app = new Koa();

app.use(serve({
  rootDir: "public"
}));

app.listen(3000);

publicディレクトリ以下にHTMLを用意

HELLO KOA !

最終的なディレクトリ構成

koa-static/
 └ app.js
 └ nodemodules/
   └ ...
   └ ...
 └ package.json
 └ public/
   └ index.html
 └ yarn.lock

解説

Koaのアプリケーションをasyncを使ったりしてモダンに書きたいが故に、

"babel-cli": "^6.24.0",
"babel-preset-es2015": "^6.24.0",
"babel-preset-es2017": "^6.22.0",

を入れてます。それに伴い、

yarn start

のタスクも、

node app.js

ではなく、

babel-node app.js

となっています。
それ以外は特に問題ないとおもいます。
モダンに書くことにいちばん労力をかけるってなんだかなぁって感じですが、きっと時が解決してくれることでしょう。