Expressサーバ上にGatsbyサイトをデプロイしてみた

最近Gatsbyをチマチマ触っているので、Expressサーバ上に載せてみました。 基本的にはExpressの静的ファイル配布機能を使用しているだけですが。

※モバイル畑なので、Web関連はあまり詳しくありません。

プロジェクトの作成

$ gatsby new foo
$ cd foo
$ npm install express

(余談ですが、npm installに --save オプションって不要になってたんですね。)

サーバ側の実装

プロジェクト直下にindex.jsを作成

$ touch index.js

index.jsの編集

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

// `gatsby build` の結果がpublicディレクトリに出力される
app.use(express.static("public/"))

app.listen(port, () => {
  console.log(`Listening at http://localhost:${port}`)
})

起動スクリプト

package.jsonの編集

...
  "scripts": {
    "prestart": "gatsby build",
    "start": "node index.js"
  }
...

サーバ起動

$ npm start

以下にアクセスして、サイトが表示されることを確認。

http://localhost:3000