GatsbyJSをはじめる

01 17, 2019

GatsbyJSとは?

GatsbyJSは、FaceBookが開発しているJavascriptフレームワークのReactJSという言語を使った静的サイトジェネレーターです。静的サイトとはHTMLしてサーバーに置く仕組みです。一方、世間のブログシェアのほとんどを占めているワードプレスは動的にサイトを生成します。動的とはユーザーがアクセスするとそれに併せてサーバーがページを生成して、レスポンスを返すサイトです。

静的サイトと動的サイトの違い

ユーザー → サーバー →HTMLを返す → ユーザー
ユーザー → サーバー → HTMLを生成 →HTMLを返す → ユーザー

なぜ今Gatsbyなのか?

複業が解禁され、ブログで副収入を得ることが持ち上げられています。
しかし、ブログで副収入を得るためにはブログを立ち上げなければならなりません。
多くの入門書では、はてなブログやアメブロ、Wordpressを使ったブログを薦めていますが、GatsbyJSを薦めている書籍はありません。
理由は、知識が必要で難しいからです。
しかし、だからこそブログプラットフォームとしてGatsbyJSをオススメしたいと思います。 Gatsbyを使えば

  • 自分の思い通りに
  • Wordpressより高速
  • 維持費が低コスト なブログを作ることが出来ます。

GatsbyJSとWordpressの違い

では、WordpressとGatsbyJSには具体的にどのような違いがあるのでしょうか?

ワードプレスにはないGatsbyJSのメリット

GatsbyJSのメリットは

  • 高速
  • 維持費が安い
  • カスタマイズが自由 といった点が上げられます。特に、ブログを始める方の8割が挫折すると言われています。 サーバーの契約は年単位ですのでWordpressのレンタルサーバーの値段は馬鹿になりません。 それに比べてGatsbyJSのホストするサーバーは、HTMLを置くだけですので値段が無料です。 つまり、GatsbyJSの年間維持費は、ドメイン代金だけですから、ドメイン更新しなければ30円とかでも独自ドメインブログが作れちゃいます。

    ワードプレスにはないGatsbyJSのデメリット

    Gatsbyのデメリットは、

  • 難しい これにつきます。Javascript、HTML、CSSの知識が必要になります。初心者には正直きついですが、知識としての資産になります。これから先はプログラミングが必修化するなど、教養としてのプログラミンが必須になる時代です。Javascript、HTML、CSSなどはWebページの表面を彩る技術でフロントエンドと呼ばれます。

まとめ

GatsbyJSとWordpressの違いを中心に書きました。 次からは、インストール方法など環境構築について書いていきたいと思います。


コリ

コリといいます。奈良県でサラリーマンをしています。GatsbyJSでサイトを作るのが趣味です。