Gatsby Starter Blog の初期設定から、数式表示などマークダウン関連機能、レイアウトの構成、そしてメニューや目次などのナビゲーション関連機能まで、Gatsby のカスタマイズの全貌を整理する。

gatsby-transformer-remark の機能を利用して、マークダウンで記述した記事に、目次が自動的に表示されるようにする。目次は記事の冒頭だけでなく、サイドバーにもスティッキー（固定）に表示されるようにして、閲覧性を更に高めたい。設定時の注意点やレイアウトの乱れに対する対応策も説明する。

React-Bootstrap を用いて、モバイルファーストに特化した Gatsby Starter Blog に対して、レスポンシブ対応したナビゲーションメニューと2カラムレイアウトを設置する。サイドバーに設置するタグ一覧のウィジェットも作成する。

Gatsby Starter Blog ほぼそのままの状態から、視覚的カスタマイズを行う準備として、React-Bootstrap を適用して基盤を整える。全体の行間やマークダウン記事のスタイリングなどの調整も行う。

マークダウン記事のタグ機能の追加方法について、簡単に整理する。記事一覧表示と記事の個別表示でタグも表示されるだけでなく、全てのタグの一覧表示や、特定のタグに関連付けられた記事の一覧も表示できるようにする。

概要 gatsby-remark-katex と katex を入れれば数式が書けるという説明があるのだけど、見事にハマったので原因と対処法を紹介します。 追記（2021-06-15） 不具合は gatsby-remark-katex 5.4.1 で解決した模様 Change …

Gatsby を選んだ理由 ウェブサイトを開設するにあたり、今まで触ったことがある WordPress ではなく、全く新しい Gatsby を選んだ理由として、次の点が挙げられる。 高いパフォーマンス React の勉強がてら CSS 練習の取っ掛かり Markdown で記事…