Vercel Web Analytics で人気記事にバッジを付ける — ビルド時に解決し、静的サイトのまま配信する
このブログが人気記事にバッジを付ける仕組み。ビルド中に Vercel Web Analytics へ 1 回問い合わせ、3 つのロケールを合算して静的 HTML に焼き込みます。
Astro
Astroの静的ブログで「いいね」を数える — Vercelの1ルートとUpstash Redis
完全な静的Astroサイトにサーバーレスなルートをひとつだけ足し、「いいね」を共有カウントする方法。Upstash Redisのキー設計と、動作を確かめるまでに踏んだCIのバグをまとめます。
Astroの図版を自分のサイズで描かせ、タップで拡大できるようにする — 固有幅・ネイティブダイアログ・@2x
Astroでwidth:100%が256pxのスクリーンショットをぼかしていた理由と、ネイティブダイアログでスマートフォンでも図版が読めるようになるまで。設計を正したのは7つの計測でした。
Pagefindのステミング警告は見当違いだった — 日本語検索を壊していたのは分かち書きの不一致
Pagefindはビルドのたびに日本語と中国語のステミング未対応を警告していました。本当の不具合は別にあり、検索語と索引のトークナイザーの不一致が誤ったページを返していました。
Astroの共有ボタンを言語ごとに出し分ける — デスクトップは固定レール、モバイルはラベル付きのピル
AstroでIntent URLから共有ボタンを組み立てる。ロケールごとに異なる共有先、広い画面での固定アイコンレール、そして途中で見つかったエンドポイントのずれ。
Astroの目次で読者の現在地を追い続ける — スクロールスパイ・共有レール・モバイルのdvh
Astroの目次にスクロールスパイの追従、見出しの深さを問わない1本のレール、dvhによる高さ上限を実装した記録。モバイルのmax-heightを無効化していた::details-contentの生成ボックスまで。
AstroブログにExpressive Codeを導入する — ファイル名タブ・ファイルアイコンと、読めていなかった97個のコードフェンス
Astro 7でExpressive Codeを導入した記録。ファイル名タブ、テーマ別のファイルアイコン、Sätteriプロセッサの落とし穴、そしてShikiが言語名として読んでいた97個のコードフェンス。
Astroのコンテンツコレクションだけでブログを運用する — CMSを捨て、MDXを選び、外部キーを型で置き換えた話
このブログにCMSがない理由。画像から決まったディレクトリ構成、MarkdownではなくMDXを選んだ判断、そして外部キーの代わりになったタグレジストリについて整理します。