ホームGatsbyGatsby.jsとNetlifyでブログを作りました。ドメイン以外は全部無料です。
2020年1月01日

Gatsby.jsとNetlifyでブログを作りました。ドメイン以外は全部無料です。

Happy new year 2020

10月28日追記
Gatsbyブログについて、初noteを書きました。
【完全版】爆速GatsbyでWordPressちっくなブログを作る全手順

こんにちは、筋肉めがねです。
2020年、新年あけましておめでとうございます。 今年もどうぞよろしくお願いいたします。

さて、2020年最初の日、新年を迎えるこのタイミングで、はてなブログからGatsbyへブログを移行しました。

Gatsbyを動かしてみて感じることは、ページ遷移がとても速いということ。そして、Reactベースで何かを作ることは初めてなので、コードエディタで編集した内容が、すぐにブラウザに反映される感覚がとても新鮮ですね。また、何より、Netlifyを使っているので、サーバー代金が無料という事が何よりもありがたい。

Gatsbyの特徴は

  • めっちゃ速い。
  • 記事の更新が簡単である。
  • PWA対応である。

以下、順番に説明していきます。

めっちゃ早い

Reactをベースとして作られているので、SPAとして動作する。SPAとはSingle Page Applicationの略です。例えば、wordpressでは、違うページに遷移する時に、違うhtmlを読み込むわけなんですが、、SPAの場合には、一つのhtmlファイル内のContent部分をjavascriptを用いて置き換える、という事を行う。このため、高速化を実現できているようです。

記事の更新が簡単である

僕はVisual Studio Codeを使っていますが、Visual Studio Codeの画面だけで、記事の更新、そしてディプロイが可能です。Markdown形式のファイルを更新し、そしてterminalにて、git pushするのみでございます。またGatsbyはdatabaseを使用しておりません。つまり、Markdown形式で記事を更新する事のもう一つの利点は、記事データが全てMarkdownファイルに入っているため、都度都度、DBのバックアップを取る必要がない、という事です。

PWA対応である

PWAとはProgressive Web Appsの略で、スマホでこのブログにアクセスすると、App Storeからダウンロードしてきたアプリにとても近いユーザーエクスペリエンスを与える事ができる、というものです。

先述しましたが、このブログでは、静的サイト用のホスティングサービスであるNetlifyを使っていますが、こちらはサーバー費が0円で、なおかつ、Lets encryptを自動でインストールしてくれるため、HTTPS対応もサクッと行えます。

具体的なブログ作成のプロセスは、次回書きます。それでは、みなさま2020年も楽しんでいきましょう。

シェアする