Node.jsのExpressが久しぶりで忘れたときに見るやつ

「Express久しぶりに使うな〜、あれ?」

**「どう書くのか忘れたー!」**というときに見るものです

環境を作る

ディレクトリを作って、ターミナルでそこに移動して
npmを初期化します

npm init -y

次にExpressをインストールします

npm install --save express

これで起動できます

node .

お好みで開発に便利なnodemonも

index.jsを用意します

index.js

const express = require("express")
const app = express()

/* 書いてあるコードはここに書いてね */

app.listen(3000, () => {
  console.log("listening at http://localhost:3000")
})

準備完了

GET - get()

これでブラウザで http://localhost:3000 にアクセスすればHello World!と返ってきます

app.get("/", (req, res) => {
  res.send("Hello World!")
})

POST - post()

Postmanやcurlなどを使って試しましょう
これで http://localhost:3000 にPOSTするとHello World!と返ってきます

app.post("/", (req, res) => {
  res.send("Hello World!")
})

場所を変える - xxx(path, ...)

/5000trillionとかにアクセスしたときのリクエストを捌こう

app.get("/5000trillion", (req, res) => {
  res.send("5000兆円\n    欲しい!")
})

簡単なデータをもらう - query

これで http://localhost:3000/5000trillion?mode=deflation にアクセスすると
デフレが起きて物価が下がり、50万円で満足します
50万円欲しい!と返ってきます

ちなみにmode=deflationは クエリ文字列といいます
URLにちょっとしたデータを含めることができます

app.get("/5000trillion", (req, res) => {
  if (req.query.mode === "deflation") {
    res.send("50万円\n    欲しい!")
  } else {
    res.send("5000兆円\n    欲しい!")
  }
})

静的な場所 - use(..., static(...))

publicフォルダーの下を/assetsにアクセスしたときに返したいとき
こんな感じになります
http://localhost:3000/assets/logo.png <-> ./public/logo.png

app.use("/assets", express.static("./public"))

ファイル分割 - Router()

ディレクトリ別に.jsファイルを分けることもできます
route.get()のパスを"/5000trillion"にすると、/5000trillion/5000trillionになるので注意

5000t.js

const express = require("express")
const route = express.Router()

route.get("/", (req, res) => {
  if (req.query.mode === "deflation") {
    res.send("50万円\n    欲しい!")
  } else {
    res.send("5000兆円\n    欲しい!")
  }
})

module.exports = route

index.js

const route = require("./5000t")

app.use("/5000trillion", route)

ミドルウェア - use(...)

get(...)などの前に認証などの処理をすることができます
ここでは、ログを出してみます
最後に必ずnext()を呼びましょう
そうしないと続きが実行されません

app.use((req, res, next) => {
  console.log(`[${Date.now()}] ${req.ip} ${req.url}`)
  next()
})

// `/5000trillion`の下だけ
app.use("/5000trillion", (req, res, next) => {
  res.setHeader("powered-by", "5000 trillion yen!") // ヘッダーを追加 CORSなんかもここでする ライブラリ使ったほうがいい
  console.log(`[${Date.now()}] ${req.ip} ${req.url}`)
  next()
})

おわり

「せや! Expressこんな感じやったな」というふうになったらいいな
もっと詳しいことは http://expressjs.com/en/4x/api.html で