OpenReplay ブログ
llms.txtファイルを検証する方法
依存関係のないNode.jsスクリプトでllms.txtのリンク、パッケージ名とバージョン、Markdown構造を検証し、CIで定期的にチェックする方法を紹介します。
JavaScriptなしでスクロールに応じてCSSアニメーションをトリガーする
JavaScriptなしでスクロール連動のCSSアニメーションを作成。構文やトリガー動作、境界の設定、IntersectionObserverによる代替策を解説します。
メールを送信せずにメールアドレスを検証する
ブラウザーのメール認証で、メールを送らずに受信箱へのアクセスを確認する方法を解説。フォーム設定、Node.jsでの5段階のトークン検証、試験運用の制限も紹介します。
Uppy 6.0と再開可能なファイルアップロード
UppyとTusで再開可能なファイルアップロードを設定し、Uppy 6.0のS3署名やcoreパッケージの変更点と、バージョン5からの移行手順を確認します。
おすすめのオンラインコードエディター
CodePen、StackBlitz、CodeSandbox、Replit、Boltを比較。各エディターで実行できる内容、GitHubからのインポート方法、サービスへの依存を避ける方法を紹介します。
WordPressの子テーマの作り方
WordPressの子テーマを作成して、親テーマの更新後もカスタマイズを維持する方法を解説。クラシックテーマとブロックテーマの設定、スタイル読み込み、テンプレートの上書きを紹介します。
コードレビューの負担を減らす自動チェック
OpenAPI、dependency-cruiser、Strykerのミューテーションテストでコードレビューを自動化。CIチェックで機械的な不具合を検出し、レビューの負荷を減らす方法を紹介します。
z-index が効かない理由
z-indexが効かない原因をDevToolsで調査。スタッキングコンテキストを作る祖先要素を特定し、モーダル、ドロップダウン、固定ヘッダーの重なりを解決します。
WebMCPとMCPの違いとは
WebMCPとMCPを実行環境、ID、ライフサイクル、検出方法で比較。使い分けの基準や、ブラウザーセッションとWebMCPの実験段階について解説します。
base-select でセレクトドロップダウンをスタイリングする
appearance: base-selectでネイティブselectメニューをCSSで装飾。ピッカー、選択肢、アイコン、アクセシビリティ、ブラウザー対応、制約を解説します。
Mac なしで iOS アプリをビルドする方法
Expo EAS、レンタルのクラウドMac、CIを使ってMacなしでiOSアプリをビルド・公開する方法を紹介。費用や署名、iPhoneでのテスト方法も比較します。
Rslib で JavaScript ライブラリを公開する
RslibでJavaScriptライブラリを公開する方法を解説。ESM・CJSビルド、TypeScript宣言ファイル、コンポーネントのスタイル設定とCIでのパッケージ検証を紹介します。
Lintを遅くしているESLintルールを特定する方法
TIMING=1とConfig Inspectorで遅いESLintルールを特定。型情報を使うルールや負荷の高いプラグインを比較し、設定を調整してLintを高速化します。
TypeScript 7にアップグレードすべきタイミングは今か？
TypeScript 7へ今すぐ移行すべき？コンパイラーの速度、互換性を壊す変更、ツール対応状況を比較し、安全な移行方法を判断できます。
ブラウザ上でAIを使って動画に字幕を付ける
Transformers.jsとWhisperで動画の字幕をブラウザー内で生成。音声を抽出し、WebGPUまたはWASMで処理してWebVTTを作成し、メディアを端末内に保持します。
ArkType：Zodより高速な代替ライブラリ
ArkTypeとZodの構文、型推論、検証速度、APIレスポンス処理を比較。ArkTypeを選ぶ場面と、Zodを使い続ける場面がわかります。
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対策、旧バージョン向けの代替手段も紹介。