スケジュール
- 1日目 要件定義編
- 2日目 環境構築編
- 3日目 ドーナッツグラフ編
- 4日目 棒グラフ編
- 5日目 GraphQL編
- 6日目 GraphQL編2
- 7日目 GraphQL編3
- 8日目 GraphQL編4
- 9日目 デプロイ編←今ここ
前提条件
- node.js v8.3以上
- yarn or npmが入っている(Document見るとyarnの方が推奨とのこと)
- Gridsomeのプロジェクトを作成している
Gridsomeプロジェクトをデプロイする方法
https://gridsome.org/docs/deployment/
Netlifyなどを利用して静的サイトをホスティングする方法やAWS S3を利用する方法などが紹介されています。
今回は一番簡単そうなNetlifyを利用してやってみました。
まずはGithubへリポジトリを追加
git init
git add .
git commit -m 'first commit.'
git remote add origin https://github.com/Dev-kenta/asset-management-app.git
git push -u origin master
NetlifyとGithubを紐付け
こちらの記事が大変参考になりました。
https://qiita.com/sugo/items/2ee64887d682b0dae635
まずはNetlifyにアクセスして、Get started for free
を押します。
こんな画面になるのでNew site from Git
を押します。
Githubとの認証を済まして、Continuous Deploymentの箇所でGithub
を選択します。
ホスティングするリポジトリに先ほど作ったものを指定。
Build command: gridsome build
Publish directory: dist
を指定してDeploy site
を押すと、ホスティングが開始されます。
少し待つとサイトがホスティングされて見れるようになります。
ドメインを設定するまでは自動でNetlifyが振り分けたドメインで見ることが可能です。しかもちゃんとhttpsで見れます。
https://priceless-kowalevski-8debd2.netlify.app/
あとは更新したらGithubにpushすると自動的にコンテンツが更新される仕組みですね。便利。
あとがき
ついにデプロイまできました。Netlifyでデプロイする方法が予想以上に簡単で驚きました。
ドメインを設定するのも簡単であればやってみようかな。
そしてついにお休みも終わり。明日からは日常が始まる。ひええ。