Gatsby で作っている当ブログで、記事にタグを付けられるようにした。
このサイトでは gatsby-transformer-remark というプラグインを使って Markdown をパースしているが、gatsby-transformer-remark を利用すると Front Matter という文書のメタデータを YAML 形式で追加できる機能が自動的に入っている。 Front Matter に以下のように記すことで、タグを付けられるようにした。
---
tags:
- design
- development
---
また、特定のタグが付いた記事を一覧するページを追加した。
試しに Gatsby について書いてある記事に gatsby というタグを付けた。
以下の URL から確認できる。
https://moristapaper/tags/gatsby
このサイトを始めて2年になるが、これまではサイトの見た目の変更しかしてこなかった。 今回の機能追加で、Gatsby のルーティングやページを追加する方法、GraphQLの書き方も触りだけ知ることができた。
ちなみに当ブログでタグの運用をしていくつもりはなく、UI 上の変化は何もない。