Gatsby.js＋Netlifyで簡単に静的サイトを作成する

hisacomです 今週は以前Gatsby.jsで作成したブログをNetlifyというホスティングサービスでホスティングすることを試したので、その内容をメモしておきます。 Gatsby.jsについては、過去の記事をご覧ください

osushi-engineer.hatenablog.com

手順としてはGithubに新規リポジトリ作成しプッシュする→Netlifyにそのリポジトリを登録するだけなので実作業としては5分ほどで完了してしまいます。

Githubのリポジトリにプッシュする

Github上で新しいリポジトリを作成後、GatsbyのディレクトリをPUSHします。

git init
git add .
git commit -m "first commit"
git branch -M main
git remote add origin https://github.com/suzukiyoshihisa/新しいリポジトリ.git
git push -u origin main

Netlifyにリポジトリを登録する

Netlify登録後のホーム画面で、New site from Gitボタンを押下し、GitプロバイダーからGithubを選択(自分のGatsby.js資材が置いてあるリポジトリのあるもので良い)。該当のリポジトリを選択して、Deploy siteボタンを押下してしばらく待てばデプロイが完了。サイトにアクセスすることができるようになります。