社内LT会で発表しました(2回目)

先月に引き続き、社内LT会で発表しました。

資料はこちら。

今回はNuxtのserverMiddlewareについて話しました。

簡単にまとめると、

  • NuxtのserverMiddlewareを使って簡単にAPIサーバーを立てられた
  • ごく簡単なアプリケーションならこれだけで良さそうな気がする
  • ただNode.jsの知見が無いので実践で活用するにはまだまだ

という感じです。

ただとりあえずNuxtだけでもある程度のことはできそうだということはわかったので大きな収穫です。

実装もnuxt.config.jsに

// Server middleware
serverMiddleware: [
  '~/api/'
],

を追加して、/api/index.jsに

const express = require('express')
const axios = require('axios')

const app = express()

app.get('/', (req, res) => {
  res.json({
    message: 'hoge'
  })
})

app.get('/advice', async (req, res) => {
  const advice = await axios.get('  https://api.adviceslip.com/advice')
  res.json(advice.data)
})

module.exports = {
  path: '/api/',
  handler: app
}

こんな感じで書くだけでAPI用のルーティングが追加できます。

ブラウザでアクセスするとこんな感じ。

実際にはコンポーネントから叩くイメージでしょうか。

async asyncData({ $axios }) {
  const response = $axios.$get('/api/advice')
  console.log(response)
}

みたいな。

Expressで拡張できるので他にも色々できそうです。ロガーを追加したりDBやredisに接続したり。

ただ↑でも書いたようにNode.jsのベストプラクティスがわからないので要勉強です。

また次回以降も学習内容を整理して登壇したいと思います。