はじめに

（ほぼ）無料で静的サイトを簡単に作れたらいいなと常々おもっていました。
最近は環境などそろってきたのでやってみます。

今回は「Gatsbyの設定」です。

前提条件

nodeのツールのため、npmでインストールします。

npm install -g gatsby

その２で作成したフォルダは利用せず、新しいフォルダにプロジェクトを作成します。
ブログのテンプレートを利用します。

cd ~/workspace
gatsby new blog https://github.com/gatsbyjs/gatsby-starter-blog

動作確認を行います。

cd blog
gatsby develop -H $IP -p $PORT

上記実行後、以下が表示されるため、クリックします。

  Local:            http://0.0.0.0:8080/

うまく英語のブログが表示されたらOKです。

デプロイ用にビルドをします。

gatsby build

firebaseのファイルを設定します。

その２で作成したファイル２本をコピーします。

cp ../gatsby-test/.firebaserc .
cp ../gatsby-test/firebase.json .

firebase.jsonを修正します。
publicを"./"から"public"に修正
rewriteを削除

firebase.json

{
  "hosting": {
    "public": "public",
    "ignore": [
      "firebase.json",
      "**/.*",
      "**/node_modules/**"
    ]
  }
}

デプロイします。

firebase deploy

以上で完成です！！

作成したドメインにアクセスしてみてください。

なお、gatsbyはこちらを参考にしました。