Cross-cutting frontend topics, tooling, and DX Compiled for immediate developer deployment.
X-API-Version」ヘッダー、APIキーの固定バージョン、システムデフォルトの順でバージョンを決定します。transformation pipelineはmigrationを双方向にチェーン適用し、requestは現在のスキーマへ変換してroute handlerに渡し、responseはクライアントが期待する旧フォーマットに戻してからシリアライズします。フィールドのリネーム、フラットなtagの配列からfilterオブジェクトへの構造変換、レスポンスツリー全体を再帰的に処理するTypeID migration、ネストフィールドの移動など、実際のmigration事例も詳しく紹介されています。このシステムは18ヶ月間無変更で稼働し、大規模なインフラ変更にも対応してきました。
fetch()リクエストをプロキシする方法を整理します。Node.jsはv22.21.0およびv24.5.0からNODE_USE_ENV_PROXY=1を設定することでHTTP_PROXY / HTTPS_PROXYが有効になり、プログラムからはundiciのProxyAgentをdispatcherオプションとして渡します。Denoはdeno.createHttpClient()にプロキシURLを指定し、clientオプションとしてfetchに渡します。Bunはfetchのオプションオブジェクトにproxy文字列を直接指定します。ネイティブプロキシをサポートしないCloudflare Workersでは、@humanwhocodes/proxy-fetch-serverをNode.js DockerコンテナでDurable Objectとしてバインドする回避策を紹介しています。
__plt_dpl」クッキーで各ブラウザセッションをセッション開始時のデプロイバージョンに固定し、Kubernetes Gateway APIのHTTPRouteルールでトラフィックをルーティングします。旧バージョンはActive → Draining → Expiredの状態を経て、Prometheusでトラフィックを監視し、設定されたグレースピリオド（デフォルト24時間）または30分間トラフィックがゼロになるとレプリカ数をゼロにスケールします。
npx vitestやnpx playwright testではなくプロジェクト独自のtest runnerを使うよう強制するTypeScript hookスクリプトの構築方法を解説します。最大の課題は、2つのプラットフォームがstdinで異なるJSON構造を送信する点です。Claude CodeはPreToolUseイベントのtool_input内にコマンドをネストし、Cursorのbeforeere ShellExecutionはトップレベルにコマンドを置きます。hookは両方の入力を正規化し、regexでブロックパターンをマッチングし、プラットフォーム別のallow/deny応答と正しいyarn test:unit / test:e2eスクリプトへの案内メッセージを返します。Node.js 22.6+の--experimental-strip-typesを使いビルドステップなしでTypeScriptファイルのまま実行でき、パースエラー時はfail-openで動作します。
Test Doubleの共同創業者で現在は日本でソロ開発者として活動するJustin Searlsは、2025年2月にリリースされたClaude Code（Sonnet 3.7から実用レベルに到達）が、従来のcopilotスタイルのツールとは本質的に異なる変曲点だと主張します。彼は開発者を、仕様通りに実装する「order taker」と、ソフトウェアのフルライフサイクルとビジネス価値を考える「野心的な」開発者に分類し、前者は約9ヶ月以内に適応しなければ淘汰されると警告します。核心的な主張は、エージェント開発でまだ未解決の問題は生成速度ではなくverifiability（検証可能性）であり、高速な自動フィードバックループなしにはエージェントが同じ場所をぐるぐる回るだけだという点です。初学者にはLLMを個人教師として基礎を学びながらエージェントを100%活用することを勧め、安定した収入がない場合は就職を待つより価値ある個人プロジェクトをゼロから完成させる経験を積むよう助言しています。
Scott Vandeheyが、クライアントの開発者や外部コントラクターと協働することの多い小規模エージェンシー、Cloud Fourのコードレビュー文化を紹介します。最大のルールは「production に出るすべての変更はレビューを受けること」で、GitHubのbranch protectionで強制されます。依存関係のマイナー更新など安全な変更に限り、一部のシニア開発者のみがbypassを許可されます。lintルール変更、コード移動、無関係なバグ修正は別々のPRに分割するよう求め、各PRには変更の「なぜ」と、その機能に初めて触れるレビュアーでも追えるステップバイステップのテストチェックリストを含めることが求められます。
Test Doubleの共同創業者で現在は日本でソロ開発者として活動するJustin Searlsは、2025年2月にリリースされたClaude Code（Sonnet 3.7から実用レベルに到達）が、従来のcopilotスタイルのツールとは本質的に異なる変曲点だと主張します。彼は開発者を、仕様通りに実装する「order taker」と、ソフトウェアのフルライフサイクルとビジネス価値を考える「野心的な」開発者に分類し、前者は約9ヶ月以内に適応しなければ淘汰されると警告します。核心的な主張は、エージェント開発でまだ未解決の問題は生成速度ではなくverifiability（検証可能性）であり、高速な自動フィードバックループなしにはエージェントが同じ場所をぐるぐる回るだけだという点です。初学者にはLLMを個人教師として基礎を学びながらエージェントを100%活用することを勧め、安定した収入がない場合は就職を待つより価値ある個人プロジェクトをゼロから完成させる経験を積むよう助言しています。
Justin Dukeが、StripeにインスパイアされたButtondownのAPI versioningシステムを解説します。semverではなく日付ベースのバージョン文字列（例："2025-06-01"）を使用し、各APIリクエストは「X-API-Version」ヘッダー、APIキーの固定バージョン、システムデフォルトの順でバージョンを決定します。transformation pipelineはmigrationを双方向にチェーン適用し、requestは現在のスキーマへ変換してroute handlerに渡し、responseはクライアントが期待する旧フォーマットに戻してからシリアライズします。フィールドのリネーム、フラットなtagの配列からfilterオブジェクトへの構造変換、レスポンスツリー全体を再帰的に処理するTypeID migration、ネストフィールドの移動など、実際のmigration事例も詳しく紹介されています。このシステムは18ヶ月間無変更で稼働し、大規模なインフラ変更にも対応してきました。
Nicholas Zakasが、主要なサーバーサイドJavaScriptランタイム4種でfetch()リクエストをプロキシする方法を整理します。Node.jsはv22.21.0およびv24.5.0からNODE_USE_ENV_PROXY=1を設定することでHTTP_PROXY / HTTPS_PROXYが有効になり、プログラムからはundiciのProxyAgentをdispatcherオプションとして渡します。Denoはdeno.createHttpClient()にプロキシURLを指定し、clientオプションとしてfetchに渡します。Bunはfetchのオプションオブジェクトにproxy文字列を直接指定します。ネイティブプロキシをサポートしないCloudflare Workersでは、@humanwhocodes/proxy-fetch-serverをNode.js DockerコンテナでDurable Objectとしてバインドする回避策を紹介しています。
PlatformaticがIntelligent Command Center（ICC）に実験的なSkew Protection機能を導入しました。CI/CDパイプラインを変更せずに、Kubernetes環境にVercelスタイルのバージョン固定を実現します。この機能が解決する問題は、新バージョンのデプロイ時に旧フロントエンドを読み込んでいたユーザーが新しいバックエンドにリクエストを送ることで発生するReact Server Componentsのhydrationエラー、APIコントラクト違反、TypeScriptの型不一致です。ICCは「__plt_dpl」クッキーで各ブラウザセッションをセッション開始時のデプロイバージョンに固定し、Kubernetes Gateway APIのHTTPRouteルールでトラフィックをルーティングします。旧バージョンはActive → Draining → Expiredの状態を経て、Prometheusでトラフィックを監視し、設定されたグレースピリオド（デフォルト24時間）または30分間トラフィックがゼロになるとレプリカ数をゼロにスケールします。
Corbin Crutchleyは、唯一のシニアエンジニアが去ったPDRTにfrontendリードとして加わった経験を語ります。不安定な基盤の上に何度も書き直されたプロジェクトと、2名のジュニアエンジニアが残された状況でした。全面的な書き直しではなく、A/Bデリバリー、viewの埋め込み、ページ単位でのtechスタック切り替えなどを通じて旧コードと新コードを同一プロダクトに統合するincremental migrationを選択しました。iOS・Android・Webにまたがるコードの重複をなくすため、TypeScript・HTML・CSSに技術を集約し、共有コンポーネント層を持つmonorepoに移行しました。その結果、6ヶ月でリライト完了、1年でWebサイトをリリースし、主要クライアントのアプリ利用率が350%向上しました。
READ_FULL_LOGarrow_forward本記事では、Claude CodeとCursorの両方でshellコマンドの実行前にインターセプトし、エージェントがnpx vitestやnpx playwright testではなくプロジェクト独自のtest runnerを使うよう強制するTypeScript hookスクリプトの構築方法を解説します。最大の課題は、2つのプラットフォームがstdinで異なるJSON構造を送信する点です。Claude CodeはPreToolUseイベントのtool_input内にコマンドをネストし、Cursorのbeforeere ShellExecutionはトップレベルにコマンドを置きます。hookは両方の入力を正規化し、regexでブロックパターンをマッチングし、プラットフォーム別のallow/deny応答と正しいyarn test:unit / test:e2eスクリプトへの案内メッセージを返します。Node.js 22.6+の--experimental-strip-typesを使いビルドステップなしでTypeScriptファイルのまま実行でき、パースエラー時はfail-openで動作します。
Cloud Fourのコードレビューガイドが今週のフィーチャー記事で、最も有益なインサイトは構造的なものです。すべてのPRは何が変わったかだけでなく「なぜ」変えたかを説明し、そのfeatureに初めて触れるレビュアーでも追えるステップバイステップのテストチェックリストを含めなければなりません。lintの変更・コードの移動・バグ修正を別々のPRに分割するこの規律が、クライアント開発者や外部コントラクターを交えた小規模エージェンシーの一貫性を保つ秘訣です。
残りの記事はアーキテクチャ思考が中心です。Corbin CrutchleyのPDRTでの経験談は、全面的な書き直しではなくincremental migrationを選ぶ実践的なプレイブックです。A/Bデリバリー・viewの埋め込み・ページ単位のtechスタック切り替えを通じて18ヶ月で利用率350%増を達成しました。Buttondownの日付ベースAPI versioningシステムは双方向のtransformation pipelineで18ヶ月間変更なしにスキーマの進化を支えています。PlatformaticのKubernetes Skew ProtectionはVercelスタイルのバージョン固定をセルフホスト環境に持ち込み、旧フロントエンドが新バックエンドにリクエストした際のhydrationエラーを解決します。
Nicholas ZakasのNode.js・Deno・Bun・Cloudflare WorkersにわたるFetch()プロキシサポート調査と、Justin Searlsのポッドキャストインタビュー — エージェント開発の未解決課題は生成速度ではなくverifiabilityであり、「order taker」と「野心的な」開発者の格差が急速に広がっているという主張 — で週を締めくくります。