Zenn

Cloudflare Pages にデプロイした静的アセットは消してもすぐには消えない

結論 Cloudflare Pages にデプロイした静的アセットは、消した後も最大一週間は消えない仕様がある。 実際にあったこと プライベートで Astro 製の静的サイトを Cloudflare Pages にデプロイしている。 先日あるページを削除したのだが、そのページの URL を直接開くと普通に表示されていることに気づいた。 キャッシュを疑ってキャッシュをすべてパージしてみたのだが、それでも消えない。 問い合わせてみたところ、下記ページを示され仕様であるとの回答を得た。 https://developers.cloudflare.com/pages/configurat...
Zenn

MDX 内の画像を Astro の Picture コンポーネントに自動変換する remark プラグインを作る

モチベーション Astro で Markdown に書いた ![alt](image-path) 形式のローカル画像は、自動で webp に変換される。 しかし私は特定のパスにある記事だけ画像に quality を指定した上で picture タグにしたかったので、今までは下記の記事を参考に、img タグを探して自力で picture タグへ変換する rehype プラグインを作成・使用していた。 https://zenn.dev/pompompudding/articles/1a8d8d54fe7823 しかし MDX の使用を前提とすれば、すべての img を Astro の P...
Zenn

Hugo で Tailwind CSS を使うための設定

まえがき かつて静的サイトジェネレータの Hugo で Tailwind CSS を使おうとするとうまくいかないことがありました。 たとえば hugo server で起動中、新しいクラスを付けてホットリロードしたのに見た目が反映されない……ということが、Hugo だと容易に起こります。 また、それを解決するための設定は一筋縄ではいきませんでした。 しかし最近改めて調べてみたら、去年 Tailwind CSS のためだけに新機能が実装されていました。 現在はそう複雑ではない設定で Tailwind CSS を快適に使うことができますので、今後 Hugo を使う方にご紹介したいと思いま...
Zenn

astro-typed-links で型安全にリンクを書く

概要 astro-typed-links は先月 v1.0.0 がリリースされたばかりの比較的新しい Astro Integration で、型安全にリンクを書けるようになる。 Astro の公式ブログ で紹介されていたので使ってみた。 環境 astro: 5.1.2 astro-typed-links は Astro v5 で追加されたばかりの astro:routes:resolved というフックを用いているため、Astro v5 が必須 astro-typed-links: 1.1.1 使ってみた インストールについては README に従って pnpm a...
Zenn

Next.js 環境で Storybook alternative の Ladle を試してみた

モチベーション Storybook は大変素晴らしいツールで非常にお世話になっているが、v6 時代に依存関係で多少面倒だった覚えがある。[1] そこで今後また Storybook 自体の更新の遅さが負債になるケースを想定し、代替ツールを調べてみて最初に見つけたのが Ladle だったので、これに移行できそうか調べてみた。 https://ladle.dev/ Ladle の依存関係については、React にしか対応しないという潔さもあってか Storybook よりはシンプルである。 webpack は使用しておらず、Vite を採用している。 Ladle を試してみる 私のユー...

Cloudflare Workers を使って Cloudflare Pages の古いデプロイを自動削除する

Cloudflare Workers を使って Cloudflare Pages の古いデプロイを自動削除する方法の画像付き解説(2022/10/15版)。

Firebase Authentication の認証を signInWithRedirect にする

Firebase Authentication の認証を signInWithRedirect にする実装について。

TanStack Query でアイテムを編集・削除時にキャッシュを書き換える

TanStack Query(旧:React Query)で一覧上のアイテムを編集・削除したとき、再フェッチせずキャッシュを直接書き換える。

Getting Started with Rails の環境を RemoteContainer で構築する

Getting Started with Rails の環境を、ローカルを一切汚さず RemoteContainer で一から構築する。

gqlgen + @graphql-codegen/typescript-react-query 環境でセッションを張る

gqlgen + @graphql-codegen/typescript-react-query 環境でセッションを張る方法のメモ。