Reactのエラー表示がスクリーンリーダーで読まれない問題を、永続コンテナとaria-pressedで直す新着!!
Reactで認証フォームを作るとき、エラー表示は `{error ?
{error}
: null}` と書くのが定番です。お気に入りボタンをトグル化する:disabled設計の落とし穴
お気に入り(いいね・ブックマーク)ボタンは、追加だけを実装して「解除」の導線を作り忘れやすい部品です。オンならdisabledにする設計が解除の経路を奪い、recordIdの保持漏れやバージョン切替時の状態引き継ぎ、モックテストでは拾えない回帰も起こります。
PWAの『オフライン再訪でログイン画面に戻される』問題をIndexedDBスナップショットで解決する
PWA(Progressive Web App)を運用していると、「オンライン時に一度使ったはずのアプリが、圏外や低速回線で再訪した瞬間にログイン画面へ落ちてしまう」という問題にぶつかることがあります。
TypeScriptの型でイベント計測のドリフトを防ぐ:新規アナリティクスイベント追加の設計パターン
型付きイベント計測基盤に新しいアナリティクスイベントを追加する際の設計パターンを解説。payload型のマップ化、発火しきい値の統一、allowlist検証との組み合わせ方など、ドリフトを防ぐ実践的な工夫を紹介します。
認証必須SPAでもクローラに本文を届ける:公開ページだけを静的プリレンダリングする設計
認証必須SPAでも、公開ページだけを限定的に静的プリレンダリングしてクローラに本文を届ける設計を紹介します。head用メタデータと本文を単一データソースから生成して内容の乖離を防ぎ、ビルド成果物に依存するE2Eテストのレーン分離方法も解説します。
GA4のuser_id同期で踏んだ2つの罠 認証×同意をどう掛け算するか
GA4のuser_idは通常のイベントパラメータとは別枠で扱われる予約済みフィールドです。認証状態とCookie同意状態を掛け合わせ、同意がなければセットせず、アカウント切替時はunset→setの順で送る実装パターンを整理します。
SPA の UIコンポーネント51個を Claude Design に取り込む——synth-entry モードの実践ガイド
npmライブラリではない普通のReact SPAのUIコンポーネントをClaude Designに取り込む実践ガイド。ビルド成果物を持たないSPAを擬似パッケージとして見せる「synth-entry」モードで、AIデザインツールへの同期手順とハマりどころを解説します。
日付ロジックの3つの落とし穴—— null センチネル / コントローラブル化 / ?? 演算子の優先順
React+TypeScriptで日付ロジックを扱う際に陥りやすい「nullセンチネル」「コントローラブル化」「??演算子の優先順」の3つの落とし穴を解説。型と意味の対応、コンポーネントの責務、演算子の優先順位といった設計の重要性を指摘し、堅牢なアプリ開発へのヒントを提供します。










