Gatsbyは次のWordpressとも言われている、Reactベースのオープンソースフレームワーク。
超高速なWebサイトやブログ、アプリを簡単に作ることができ、今最も注目されているCMSツールでもあります。
ここではGatsbyをこれからはじめる人のために、インストール〜静的サイトのビルドまでをサクッと解説していきます。
Node環境のインストール
まずは環境のチェック。nodeは11.10以降にする必要がある。
brew使ってたので、brewでnodeをアップデートする。
node入ってない人はここからダウンロードできる。
brew upgrade node
// nodeをインストールしてない場合
brew install node
インストールできたらnodeのバージョンチェック。
node -v
v13.11.0
Gatsbyのインストール
npm install -g gatsby-cli
gatsby new gatsby-site
cd gatsby-site
gatsby develop
http://localhost:8000にアクセス。ページが表示されればOK。
静的サイトのビルド（生成）
コマンドで自動的にファイルを作成してくれる。
gatsby build
ビルドすると、puglicフォルダに静的サイトが作成される。あとはサーバーにアップすればWebサイトを表示できる。
Gatsbyのスターターライブラリを使ったインストール
Gatsbyはデフォルトだけでなく、ブログやWebサイト、ポートフォリオサイトなどのスターターライブラリがあり、効率よく開発をスタートできる。
スターターライブラリ
https://www.gatsbyjs.org/starters/?v=2
ブログを作りたい場合はこちら。
gatsby new gatsby-starter-blog https://github.com/gatsbyjs/gatsby-starter-blog
Gatsbyのリソース
ドキュメントがしっかりしてるので、そこ見ればだいたいのことはわかる。
プラグインやライブラリなどもリンクされてるので、公式のリソース集はチェックしておきましょう。
最新情報はTwitterやRedditを活用。