開発ツール28 件の記事

開発ツール の記事

Oxc / Oxlint の歩き方 - Rust 製 JavaScript ツールチェーンと ESLint の現実的な付き合い方

Oxc / Oxlint の歩き方 - Rust 製 JavaScript ツールチェーンと ESLint の現実的な付き合い方

Rust 製の JavaScript ツールチェーン Oxc と、その目玉である高速リンタ Oxlint を整理します。Oxc が含むツール群(パーサ・Oxlint・Oxfmt・トランスフォーマ・リゾルバ・ミニファイア)、ESLint 比 50〜100倍という速度、tsgo による型認識リント、そして「全部置き換える」のではなく ESLint とどう分担するかを、導入判断の目線でまとめます。

PHP バージョン履歴の歩き方 - PHP 5 から 8.5 までの変更点と追加機能を整理

PHP バージョン履歴の歩き方 - PHP 5 から 8.5 までの変更点と追加機能を整理

PHP のバージョン履歴を、各版の変更点と追加機能とともに整理します。PHP 5 系の OOP 整備、PHP 7 系のパフォーマンス革命と型、PHP 8 系のモダン化(JIT・enum・property hooks)まで。さらに 2025年11月リリースの PHP 8.5(パイプ演算子・clone with・URI 拡張)と PHP 8.4 の新機能を php.net の公式情報をもとにまとめ、サポート状況と移行の指針も示します。

React Router v7 の歩き方 - Declarative / Data / Framework の3モードと Remix 統合後の姿

React Router v7 の歩き方 - Declarative / Data / Framework の3モードと Remix 統合後の姿

React Router v7 を、3つのモード(Declarative / Data / Framework)という軸で整理します。単なるルーターから、ローダー・アクションを持つデータ駆動、さらに Vite プラグインで SSR まで含む「フレームワーク」へと段階的に広がる構造、Remix が React Router v7 に統合された経緯、そして Next.js 以外の選択肢としてどう位置づけるかを実務目線でまとめます。

OpenAI Codex CLI 実践入門 - ターミナル自律エージェントを Claude Code と並べて使う

OpenAI Codex CLI 実践入門 - ターミナル自律エージェントを Claude Code と並べて使う

OpenAI の Codex CLI を、Claude Code を使ってきた目線で整理します。Rust 製のオープンソースなターミナル型コーディングエージェントで、インストール・ChatGPT サインインでの認証、承認モードとサンドボックス(read-only / workspace-write / danger-full-access)、codex exec の非対話実行、AGENTS.md と MCP 対応まで。Claude Code との共通点と違いを実務目線でまとめます。

Storybook 10 の歩き方 - コンポーネントカタログからテスト基盤へ、Figma 連携まで

Storybook 10 の歩き方 - コンポーネントカタログからテスト基盤へ、Figma 連携まで

Storybook 10 を、いまの立ち位置から整理します。コンポーネントを分離して開発する「カタログ」から、インタラクション・アクセシビリティ・ビジュアルを含むテスト基盤へと役割が広がりました。あわせて addon-designs や Storybook Connect、Figma Code Connect によるデザインとの往復を、実務の導入目線でまとめます。

Zod 4 の歩き方 - 型と実行時バリデーションをつなぐ、LLM出力検証まで

Zod 4 の歩き方 - 型と実行時バリデーションをつなぐ、LLM出力検証まで

Zod 4 を実務目線で整理します。Zod 3 からの大幅な高速化とバンドル削減、z.email() などトップレベルに移った文字列フォーマット、error パラメータへ統一されたエラー指定、registry と .meta() によるメタデータ、z.toJSONSchema() での JSON Schema 変換、そして tree-shakable な Zod Mini まで。フォームや API 境界、LLM の構造化出力検証での使いどころをまとめます。

Angular 21 の zoneless 化 - Zone.js を外す変更検知の新標準と移行チェック

Angular 21 の zoneless 化 - Zone.js を外す変更検知の新標準と移行チェック

Angular 21 で標準になった zoneless 変更検知を整理します。長年 Angular の再描画を握ってきた Zone.js がなぜ外れるのか、Zone.js なしで何が変更検知を起動するのか(Signals・markForCheck・setInput・イベント・dirty view)、有効化と Zone.js 除去の手順、そして既存 Angular 案件の移行チェックリストを、React/Vue 勢にも分かるようにまとめます。

Chrome の組み込み AI APIs 入門 - ブラウザ内 Gemini Nano で何ができて何がまだ実験的か

Chrome の組み込み AI APIs 入門 - ブラウザ内 Gemini Nano で何ができて何がまだ実験的か

Chrome に搭載されたオンデバイス AI(Gemini Nano)を使う組み込み AI APIs を整理します。Translator・Summarizer・Language Detector・Prompt・Writer・Rewriter・Proofreader それぞれの安定度、availability から create で使う共通の作法、サーバー LLM との使い分け、そしてフォールバック設計まで、実務で踏むべき注意点をまとめます。

Node.js 26 の注目点 - Temporal 既定有効と「ビルドなしTS実行」の現在地

Node.js 26 の注目点 - Temporal 既定有効と「ビルドなしTS実行」の現在地

2026年5月リリースの Node.js 26 を整理します。長く待たれた Temporal API のデフォルト有効化、type stripping によるビルドなし TypeScript 実行の安定化(と --experimental-transform-types の削除が意味すること)、V8 14.6・Undici 8 への更新、レガシー stream モジュールの削除など、移行前に押さえておきたい差分をまとめます。

Playwright MCP 入門 - AIエージェントにブラウザ操作と画面確認を任せる

Playwright MCP 入門 - AIエージェントにブラウザ操作と画面確認を任せる

Microsoft 製の Playwright MCP を整理します。LLM にブラウザ自動化を開放する MCP サーバーで、スクリーンショットや視覚モデルではなくアクセシビリティツリーを使うのが特長です。Claude Code への導入(claude mcp add)、提供される主なツール、headless / isolated などの実行モード、そして「実装したが画面を見ていない」問題への効き方をまとめます。

Tailwind CSS v4 実践移行 - JS設定から CSS-first と @theme へどう移すか

Tailwind CSS v4 実践移行 - JS設定から CSS-first と @theme へどう移すか

Tailwind CSS v4 への移行を、単なる新機能紹介ではなく「設定思想の転換」として整理します。自動アップグレードツール、@tailwind ディレクティブから @import への変更、tailwind.config.js から @theme への移行、@tailwindcss/postcss / vite などパッケージ分離、ブラウザ要件、詰まりやすいユーティリティ改名まで、移行設計の勘所をまとめます。

WebMCP とは何か - サイトが AIエージェントに「道具」を渡すブラウザネイティブな仕組み

WebMCP とは何か - サイトが AIエージェントに「道具」を渡すブラウザネイティブな仕組み

Google I/O 2026 で公開され Chrome 149 でオリジントライアルが始まる WebMCP を整理します。ブラウザ内の AIエージェントに対して、サイト側が document.modelContext.registerTool で構造化ツールを公開する新しい Web 標準提案です。MCP との違い、API の書き方、現状の対応状況と注意点をまとめます。

Claude Code 公式 frontend-design プラグイン - 「いかにもAI」なUIを脱する導入と仕組み

Claude Code 公式 frontend-design プラグイン - 「いかにもAI」なUIを脱する導入と仕組み

Anthropic 公式の frontend-design プラグインを実際に導入して中身まで確認します。インストール手順、スキル1つだけという構成、SKILL.md に書かれたデザイン哲学(避けるべき汎用AIデザイン、大胆な方向づけ、タイポグラフィ・配色・モーションの指針)、使い方と注意点を、手元の v1.0.0 を読みながら整理します。

pnpm 10 のサプライチェーン防御 - postinstall を止めて依存を「承認」する

pnpm 10 のサプライチェーン防御 - postinstall を止めて依存を「承認」する

pnpm 10 はインストール時の依存のビルドスクリプト(postinstall 等)をデフォルトでブロックし、明示的に承認した依存だけ実行します。onlyBuiltDependencies や approve-builds、minimumReleaseAge を使った現実的なサプライチェーン防御設定を、手元の pnpm 10.12.4 の挙動を確認しながら整理します。

Vite 7 と Rolldown - アップグレード前に押さえる Node 要件・ブラウザターゲット・バンドラ移行

Vite 7 と Rolldown - アップグレード前に押さえる Node 要件・ブラウザターゲット・バンドラ移行

Vite 7 の変更点を、アップグレードで詰まりやすい順に整理します。Node.js 20.19+/22.12+ 要件、デフォルトブラウザターゲットの baseline-widely-available への変更、Rust 製バンドラ Rolldown(rolldown-vite)への移行、Sass legacy API 削除など、移行前に知っておくべき差分をまとめます。

Git GUI からターミナルへ - lazygit / gitui / tig で Git 操作を速くする 2026

Git GUI からターミナルへ - lazygit / gitui / tig で Git 操作を速くする 2026

GUI から TUI(ターミナルUI)へ移る開発者が増えています。キーボードだけでステージング・対話的リベース・stash を高速にこなす lazygit、Rust 製で軽量な gitui、ログ閲覧に強い tig を、特徴と使いどころで比較します。ターミナルから手を離さず Git を回したい人向けのまとめです。

WebAssembly はブラウザを出た - Component Model と WASI で何が変わったか 2026年版

WebAssembly はブラウザを出た - Component Model と WASI で何が変わったか 2026年版

2025年9月に標準化された WebAssembly 3.0、多言語を高レベルIFで合成する Component Model と WIT、サーバ・エッジへ広がる WASI を整理します。WebAssembly が「ブラウザの最適化技術」から「安全で可搬な普遍ランタイム」へと立ち位置を変えた2026年の現在地をまとめます。

set -euo pipefail とは何か - Bashスクリプト冒頭の「おまじない」を正しく理解する

set -euo pipefail とは何か - Bashスクリプト冒頭の「おまじない」を正しく理解する

Bashスクリプトの冒頭でよく見る set -euo pipefail を、-e(errexit)・-u(nounset)・-o pipefail の3つに分解して解説します。それぞれの意味、set -e が効かない落とし穴、IFS との組み合わせ、実践的なテンプレートまで、bash 5.3 での実挙動を確認しながら整理します。

Google I/O 2026 開発者視点まとめ - Antigravity 2.0、Gemini 3.5 Flash、Managed Agents、AI Studio の Android 対応

Google I/O 2026 開発者視点まとめ - Antigravity 2.0、Gemini 3.5 Flash、Managed Agents、AI Studio の Android 対応

2026年5月19日のGoogle I/O 2026から、開発者に効く発表を整理。エージェント開発プラットフォーム Antigravity 2.0、Gemini 3.5 Flash、API1コールのManaged Agents、AI Studioのネイティブ Android(Kotlin)対応、そして Gemini CLI 統合の意味を解説します。

Playwright CLI v0.1.8 で普段使いの Chrome にそのまま attach する - ログイン済みブラウザを AI エージェントから操作する

Playwright CLI v0.1.8 で普段使いの Chrome にそのまま attach する - ログイン済みブラウザを AI エージェントから操作する

Playwright CLI v0.1.8 で追加された attach --cdp=chrome を試す。chrome://inspect/#remote-debugging 経由で普段使いの Chrome / Edge へ直接接続し、ログイン状態や拡張機能つきのまま AI エージェントから操作するセットアップと、Chrome DevTools MCP autoConnect との使い分けを整理します。

Claude Code Setup プラグイン 徹底解説 - コードベース分析で MCP / Skills / Hooks / Subagents / Slash Commands を自動レコメンド

Claude Code Setup プラグイン 徹底解説 - コードベース分析で MCP / Skills / Hooks / Subagents / Slash Commands を自動レコメンド

Anthropic 公式の Claude Code 拡張プラグイン「Claude Code Setup」を、5つのレコメンドカテゴリ(MCP・Skills・Hooks・Subagents・Slash Commands)の仕組み、インストール方法、プロジェクト検出ロジック、関連プラグインまで実装目線で整理します。