Gatsbyのカスタマイズ
Gatsby Starter Blog の初期設定から、数式表示などマークダウン関連機能、レイアウトの構成、そしてメニューや目次などのナビゲーション関連機能まで、Gatsby のカスタマイズの全貌を整理する。
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 で記事…
情報システムなどが高度に進化した便利な時代に対するアンチテーゼとして、数学・コンピュータサイエンスなどから 古典的だけど基礎として重要なテーマ を、好奇心の赴くがままに勉強します。 「車輪の再発明」を強く奨励! グロタンディークなどへの憧れからか、ついつい抽象論に偏りがちだった…