EmDashに記事カード機能を追加した

omomuki 立ち上げ日記 #4

はじめに

omomuki という個人ブログを始めた。

これまでの記事がブログの立ち上げに関する内容ばかりだったので、「omomuki立ち上げ日記」というカテゴリを作ることにした。

カテゴリを作るにあたって、過去の記事への導線も用意したいと思った。そこで思い付いたのが、ZennやQiitaなどでよく見かける記事カードだ。

記事タイトルだけを並べるよりも、どんな記事なのかが分かりやすくなると思った。

そこで、記事カードを追加してみることにした。

まずはプラグインがないか探してみたが、標準では記事カード機能は用意されていなかった。

EmDashはAstroで作られているため、比較的自由に機能を拡張できる。せっかくなので、自分で作ってみることにした。

実装自体は思ったより簡単だった。

記事の情報を取得し、カード形式で表示するコンポーネントを作成するだけで、それらしい見た目になった。

実際に作った記事カードはこんな感じだ。

シンプルでわかりやすく良い。

最初は専用のプラグインが必要だと思っていた。

しかし、EmDashはAstroベースなので、自分で機能を追加しやすい。

今回は記事カードを追加しただけだが、今後も「こういう機能が欲しい」と思ったら自分で実装していこうと思う。

今回やったことは以下の通り。

これで立ち上げ日記シリーズも見やすくなったと思う。

omomuki 立ち上げ日記 #3はこちら:

omomuki 立ち上げ日記 #5 (近日公開予定)