Gatsby.jsとは
Gatsby.js（ギャッツビー）は、React向けの静的サイトジェネレータです。 Gatsby.jsを使うと、表示が高速でモダンなUIのReact製サイトを、SEOに強い静的サイトとして作成できます。
静的サイトジェネレータ（SSG＝Static Site Generator）とは、何らかの言語で書いたコードから、HTML/CSS/JavaScriptによる静的なウェブサイトを生成するツールのことです。
Gatsby.jsによる開発では、テンプレートを使うの一般的です。スターターテンプレートを利用したり、自分で作成したテンプレートを用意すると、Gatsby.jsが静的なHTML/CSS/JavaScriptファイルを生成してくれます。Gatsby.jsによって生成されるのは、React製のウェブサイトです。
Gatsby.jsでは表示が非常に高速な、いわゆる“爆速サイト”を簡単に構築できます。面倒なコーディングをGatsby.jsに丸投げできるため、効率よくサイト制作ができます。
将来にも普遍的なウェブ構築手法
Gatsby.jsは、2015年に登場した比較的新しいツールですが、データベース不要、複雑なコーディング不要、爆速サイトを構築できることなどから、急速に人気を集めています。
公式サイトには、「過去10年間の技術でウェブサイトを構築しないでください 」と記載されています。この言葉には、PHP + MySQLなどのLAMP環境で構築する複雑で遅いウェブサイトはやめましょうというニュアンスも含まれていそうです。
その代わり、JavaScriptが生成する高速なウェブサイトを低コスト・低メンテナンスで実現しましょうと呼びかけています。こちらの手法こそがウェブページ本来の在り方で、そのための普遍的なJavaScriptフレームワークがGatsby.jsというわけです。
Gatsby.jsとWordPress
Gatsby.jsとWordPressを比較すると、表示速度ではGatsby.jsに軍配が上がります。Gatsby.jsがビルド時点で静的なHTMLファイルやCSSファイルを生成してしまうのに対して、WordPressではユーザーがリクエストした時点で動的にウェブページを生成しています。
Gatsby.jsがJavaScriptによる静的サイトジェネレータなら、WordPressはPHPとMySQLによる動的サイトジェネレータと言えるでしょう。WordPressで構築するブログにはMySQLなどのデータベースが必要ですが、Gatsby.jsはデータベース不要です。
もし、WordPressによるブログ構築を面倒に感じているなら、Gatsby.jsの利用を検討しても良いかもしれません。Gatsby.jsならデータベース不要で、表示が高速なウェブサイトを簡単に構築できます。
Gatsby.jsの特徴
Gatsby.js には、以下の特徴があります。
- テンプレートにより静的なHTML/CSS/JavaScriptのソースが生成される
- React製の静的サイトが簡単に作成できる
- 表示が非常に高速なウェブサイトが作成できる
- モダンなウェブアプリケーションが構築できる
- シングルページアプリケーション（SPA）でも、SEO的に不利にならないように構築できる
Gatsby.jsを利用すると、テンプレートにより静的なHTML/CSS/JavaScriptファイルが生成されます。表示が非常に高速な“爆速サイト”を作成できるのが、Gatsby.jsを利用するメリットのひとつです。
Gatsby.jsは、Reactをベースにしています。Gatsby.jsを利用すると、React製のモダンで高速なウェブアプリケーションを簡単に構築できます。
Gatsby.jsを学ぶメリット
Gatsby.jsで求人を検索すると、ウェブ開発エンジニアなどの職種で数件だけヒットしました。
この数件の求人を見る限りでは、Gatsby.jsのスキルを指定しているというよりは、静的サイトジェネレータ―を使ってReactサイトを構築できる技術者が求められているのかもしれません。
Gatsby.jsのスキルが歓迎される職場では、他に使えることが望ましいスキルとして、HTML/CSS/JavaScript、React.js、Vue.js、Node.jsなどが挙げられています。
Gatsby.js公式サイト： https://www.gatsbyjs.org/
