2024年7月17日6 min readDEVAstroのBlogにモバイル表示用のタブバー(TabBar)を追加するAstroで構築したBlogサイトにモバイル表示用のTabBar(タブバー)を実装する。今回は次の3つのボタンを配置する「ホームへ戻る」「Topへ戻る」「目次を表示する」。一連の実装手順についてまとめる。
2024年7月13日7 min readDEV【Astro/Shiki】markdownのコードブロックにファイル名とdiffを追加するAstroのmarkdwonまたはMDXで記述したコードブロックについて、ファイル名やコードのdiffを表示できるようにする。シンタックスハイライターはShikiを使用。remarkのpluginとコードブロックのcomponentを追加する。一連の実装手順をまとめた。
2024年7月12日7 min readDEVAstroのrssフィードに記事の本文を追加する「@astrojs/rss」によるrss.xmlにBlog記事の本文を追加する。MDXファイルを対象に、markdownのパース、埋め込んだcomponentタグやcode blockのサニタイズ処理を行う。一連の手順を備忘録としてまとめる。
2024年7月7日6 min readDEVvscode-textlintで日本語の文章校正をしよう【mdx / md / html / txt】VSCodeの拡張機能「vscode-textlint」をインストールし、4種類のファイル(.mdx / .md / .txt / .html)でtextlintによる日本語の文章校正を自動化する。mdxは設定が複雑のため詳しい手順をまとめる。校正ルールはJTF日本語標準スタイルのルールセットを用いる。