いまさらかもしれないがGatsbyJSを使ってみる(2)

ウェブの海

11時半にその日初めてごはんを食べることをブランチとは呼ばない気がします(ランチで良いのでは……)。
前回が気になる方は以下からどうぞ。

.jsファイルなどを編集します

プロジェクト直下にある、「config.js」を編集します。
URLはnetlifyに公開することを想定して入力しておきます。
よくわからないところは極力触りません。

ちなみに、フォルダ「/static」にあるものはどうもコンパイルや処理などをされないようです。
画像データは基本「/static/media」に置いておく想定の模様。

基本的には「/src」にソースをおきます。

「/content」にはそれぞれフォルダを分けて(初期だと「/pages」と「/posts」がありました)、.mdファイルで投稿本文と固定ページを作ります。
マークダウンなので書きやすいです。
たまに文法ど忘れしますが。

buildします

とりあえず恰好がみたかったので、ここまでの段階で実際にサーバーにあげるファイルを作ります。
次のコマンドをたたいてください。

$ gatsby build

数分かかります。待ちましょう。
buildが終わると、「/public」にファイルがコンパイルされます。

deployします

netlifyにアカウントを作り、デプロイします。

わたしはマニュアルでアップロードしました。
デプロイするフォルダ「public」を破線で囲まれたエリアにドラッグ&ドロップします。
(「Need to update your site? Drag and drop your site folder here」と書いてあるエリアです)

すると適当なドメインやサイト名がつくので、適宜変更します。
「Site Settings」と「Domain Settings」から設定します。
無料のドメインだと、「〜.netlify.com」の「〜」の部分を変更できます(独自ドメインも設定可能です)。
勝手にSSLなアドレスになるのでとても助かります。

「Pdoduction」のところが「Published」になっていれば、サイトが公開されています。

日々改良します

さりげなくGoogleAnalyticsで解析できたり、何やらとても便利なかんじです。
無料枠を超えることはたぶんないと思うので(超えそうになったら、ドメインとってレンサバに移します)、のほほんと改良していきたいと思います。

タイトルとURLをコピーしました