Reactを静的サイト化するGatsby.jsを使うメリット

「Gatsby.jsを使ってみたい」
「Gatsby.jsを使うメリットは？」
「Gatsby.jsにはどんな機能があるの？」

僕も最近まではこうした疑問を持っていました。

今回は僕なりに調べた内容をもとに、上記の疑問に回答していく記事です。

前回の記事ではReactのフレームワーク「Next.js」について解説しました。

そして今回はNext.jsと肩を並べる、Reactの静的サイトジェネレータ「Gatsby.js」について解説していきます。

Reactの静的サイトジェネレータGatsby.jsとは

Gatsby.jsは、Reactで作ったコンポーネントを静的なWebサイト化するために使われるます。

こうした機能を持つツールを「静的サイトジェネレータ」と呼びます。

Gatsby.jsの機能とNext.jsとの違い

そんなGatsby.jsと比較されるのがNext.jsです。

Next.jsはツールではなくフレームワークなので、Gatsbyとは少し毛色が異なります。

実際のところ、Next.jsにも「静的サイトジェネレータ」としての機能があります。

ただし、「静的サイトジェネレータ」をメインで使うのあればGatsbyを選択しておくのが良いでしょう。

Gatsby.jsを使うメリット

Gatsby.jsを使うメリットは主に3つあります。

詳細は「静的サイトジェネレータ」に関する記事で解説しているので、そちらを参照してみてください！

ABOUT ME

稲垣 貴映

サーバーエンジニア兼Webフロントエンジニア。 新卒で独立系SIerに入社後、金融系システム基盤の構築・運用を3年間経験。 プログラミングを独学していた頃に、CEOの馬谷が開講していたSwiftスクールに通い、2019年9月に入社。 趣味はブラジル音楽の演奏。