GatsbyはReactベースの静的サイトジェネレーター(PHPのようにユーザーのリクエストを受けてからページを構築するのではなく、あらかじめ必要なページを用意しておく。なので、「高速」「安全」がウリ)です。
私も実際に一つGatsbyで作ったブログを運用しています。
大分ツーリング
おんせん県大分のツーリング情報を発信していきます!穴場ツーリングスポットやツーリンググルメなど、地元大分在住だからこそわかる魅力をお伝えします。その他バイクに関...
Gatsbyはまだまだ系統的に作り方をまとめた日本語サイトが少ないので、少しずつですがこのブログでまとめていけたら、と思います。
クマ
「Gatsbyならとりあえずこのブログを見ればOK」というブログを目指したいですね!
とりあえず読んでほしい
基本(設定やパーツの作り方など)
- 【GatsbyJS製ブログ】ページを作るcreatePageの仕組みを理解する
- 【GatsbyJS製ブログ】GatsbyにおけるGraphQLの基本を丁寧に説明
- 【GatsbyJS製ブログ】SCSS & CSS Modulesで快適CSS開発環境を作る
- 【GatsbyJS製ブログ】フォントをGoogleフォントに変更する
- 【Gatsby製ブログ】FontAwesome?いやReact Iconsでアイコンを使う!
- 【GatsbyJS製ブログ】ヘッダーとフッターのパーツ化「exportとimport」
- 【GatsbyJS製ブログ】MDXを使えるようにする!あと書き方とか!
- 【GatsbyJS製ブログ】画像の扱い方(gatsby-plugin-image使用例も)
- 【GatsbyJS製ブログ】これだけ!GatsbyにおけるSEO設定一覧!
- 【Gatsby製ブログ】Googleアナリティクス設定gatsby-plugin-google-gtag利用
- 【GatsbyJS製ブログ】コピペで簡単!問い合わせフォームを設置する
- 【GatsbyJS製ブログ】gatsby-plugin-manifestでPWA化
- オススメ!【GatsbyJS製ブログ】MDXの記事に画像を表示(gatsby-plugin-imageの利用法も)
- オススメ!【GatsbyJS製ブログ】Google マップをAPIなしでブログに埋め込む
- オススメ!【GatsbyJS製ブログ】Youtubeの埋め込み(レスポンシブ対応も)
- オススメ!【GatsbyJS製ブログ】リッチな内部リンクを作る(useStaticQuery使用)
動きをつける!【framer-motion】
- オススメ!【Gatsby製ブログ】framer-motionの基本的な使い方
- オススメ!【Gatsby製ブログ】framer-motionでVariantsを使う!
- オススメ!【Gatsby製ブログ】framer-motionで好きなタイミングでアニメーション発火
- オススメ!【Gatsby製ブログ】framer-motionでスクロールしたらフワッと表示させる
動きをつけるならReactの記事もオススメです!フックについてなるべくわかりやすく説明しています。