OpenReplay ブログ
WordPress の theme.json ファイルに記述する内容
WordPressのtheme.jsonに記述する設定やスタイル、CSS変数の生成方法、プリセット、カスタムCSS、子テーマの仕組みを解説します。
シングルページアプリで 3D セキュアを扱う方法
Stripeを使ったSPAで3D Secureを処理する方法を解説。決済状態を保存し、復帰ルートを再構築して、PaymentIntentの状態をサーバー側で確認します。
CSSでテキストの上下にできる余分なスペースを解消する方法
CSSのtext-box-trimで文字の上下にある余白を調整。フォントメトリクスとline-heightが隙間を生む仕組み、text-box-edgeの選び方、旧ブラウザー向けの代替策を解説します。
AIコーディングエージェントのトークン使用量を削減する方法
AIコーディングエージェントのトークン使用量を削減。対象ファイルを絞り、指示を簡潔にし、実装前に計画を立てて、セッションを新しくします。
Waku:Next.js を使わずに React Server Components を動かす
WakuはNext.jsを使わずにReact Server Componentsを扱える軽量Reactフレームワークです。サンプルアプリを作り、ルーティングや描画、デプロイを解説します。
git bisectで問題のあるコミットを特定する
git bisectで不具合の原因となったコミットを特定。信頼できる基準を選び、テストを自動化し、不安定な結果やスキップに対処して原因を確認します。
pnpm の Rust リライトの舞台裏
pnpm 12のRust書き換え、ベンチマーク結果、pnpm 11との互換性、CIのインストールに影響するアップグレード時の注意点を解説します。
ライブラリを使わずにNodeでZIPファイルを読み書きする
Node.js 26.8.0の実験的なnode:zlib APIでZIPを読み書きする方法を解説。ストリーミング、zip-slip対策、旧バージョン向けの代替手段も紹介。
nth-childの計算なしで実現するスタッガーアニメーション
nth-childの連続ルールやJavaScriptのループをsibling-index()で置き換え、CSSアニメーションを順番に表示。逆順、中央からの演出、対応状況も解説。
モバイルアプリ開発に使えるAIツール5選
AIモバイルアプリ作成ツール5選、Dactyl、Rork、FlutterFlow、Thunkable、Bubbleを比較。コードの書き出し、対応OS、料金、ストア公開を確認できます。
User-Agent文字列は今でも信頼できるのか?
User-Agent文字列の信頼できる項目とブラウザーが固定する値を解説。ChromiumのClient Hintsや機能検出で不安定な解析を置き換える方法も紹介します。
Linux マシンにおける Docker のセキュリティ対策
Dockerグループへのアクセスはroot権限を与えます。rootlessモード、sudoルール、Podman、コンテナの強化、監査チェックリストでLinux上のDockerを保護します。
コンパイル済みスキーマでZodのバリデーションを高速化する
Zodのコンパイル済みスキーマで検証を高速化する方法、効果が出る場面、コストや非対応スキーマ、CSPとCloudflare Workersの制約を解説します。
useEffectが2回実行される理由
React StrictModeで開発時にuseEffectが2回実行される理由と、適切なクリーンアップで通信やリスナーなどの問題を直す方法を解説します。
カスタム Gutenberg ブロックの作り方
React、block.json、PHPで独自のGutenbergブロックを作成。属性、静的・動的レンダリング、旧バージョン対応で検証エラーを防ぐ方法を解説します。
HTTPに検索のための新しいメソッドが登場
HTTP QUERYは、リクエストボディで検索する安全かつ冪等なメソッドです。キャッシュや再試行の仕組み、対応クライアント、遮断される環境を解説します。
Webhook署名を検証する方法
ExpressでStripeとGitHubのWebhook署名を検証。生のリクエスト本文、一定時間のHMAC比較、リプレイ対策、シークレットのローテーションを解説します。
あまり知られていない Linux ディストリビューション 5 選
開発者向けの知名度が低いLinuxディストリビューション5種、CachyOS、Bazzite、Nobara、Vanilla OS、Chimera Linuxを、ドライバーや更新、ツール面から比較します。
Vitest 5 の変更点
Vitest 5の変更点を解説。性能向上、互換性を損なう変更、新しい既定値、レポートの保存先、テストとCIの移行手順を確認できます。
Sassの代わりにネイティブCSSミックスインを使う方法
@mixinと@applyでSassミックスインをネイティブCSSへ移行する方法、引数の扱い、Sassが引き続き必要な機能を解説します。
アプリに貼り付けられたテキストをクリーンアップする
Webフォームに貼り付けたテキストを、Unicode正規化、書式文字の削除、空白の圧縮、ZWJとNBSPの安全な扱いで整えます。
scriptc で TypeScript をネイティブバイナリへコンパイルする
scriptcはTypeScriptをネイティブバイナリに変換し、静的ビルド、620KBの動的エンジン、coverage確認、明確な診断を提供します。
Meta のデザインシステム「Astryx」を初めて触ってみる
MetaのオープンソースデザインシステムAstryxは、150以上のReactコンポーネント、テーマ、CLI設定、カスタマイズ段階、shadcn/uiとBase UIとの比較を解説します。
JavaScriptのスタックトレースの読み方
JavaScriptのスタックトレースを読む方法: 最初に見るべきフレーム、asyncの抜け、圧縮コード、source map、Error.causeを解説。