開発のスキル

Nxの生成機能で、既存の構成や命名規則に合うアプリ、ライブラリ、機能のひな型を作ります。適切なジェネレーターの探索と実行前の確認から、生成後の調整・検証まで扱います。

• 既存構成に合うライブラリを作りたいとき
• アプリやコンポーネントのひな型作成
• 独自のジェネレーターを探して使いたいとき

ReactとNext.jsのコードを性能面から見直し、データ取得の待ち時間や配信コード量、不要な再描画を減らす改善を影響の大きい順に進めます。

• Reactコードの性能レビュー
• Next.jsのデータ取得を速めたいとき
• 配信コード量と読込時間の削減

Chromeで開いたページを操作し、表示の不具合や通信エラー、読み込みの遅さを調べるスキル。スクリーンショットの撮影や、通信・CPU条件の再現にも対応します。

• ページのエラーや通信失敗を調べたいとき
• 読み込みの遅さや表示のずれの原因調査
• ページや要素のスクリーンショット撮影

Nxで複数プロジェクトを管理する環境を調べ、設定や依存関係、変更の影響範囲を確認し、プロジェクト間の境界やキャッシュ、CI/CDを整えるスキルです。

• Nx環境のアプリと共有ライブラリの把握
• 変更が影響するプロジェクトの確認
• プロジェクト境界とキャッシュの設定

Webサイトの安全性・ブラウザ互換性・コード品質を見直し、HTTPSや依存関係、非推奨API、HTML構造、エラー処理などの確認と改善を支援するスキル。

• HTTPSやヘッダー、Cookieの確認
• 依存関係と入力値の扱いの点検
• 非推奨APIの更新と互換性改善

Webサイトの表示や操作の遅さに対し、画像・フォントの読み込み、JavaScriptの容量、キャッシュを見直し、優先順位を付けた改善と検証を進めるスキル。

• ページの読み込みを速くしたいとき
• JavaScriptの配信容量を減らしたいとき
• 画像とフォントの読み込みを見直したいとき

Webページの主要コンテンツの表示速度、操作への応答、表示位置のずれを調べ、Core Web Vitalsの3指標に沿って改善するスキル。

• メイン画像の表示を速めたいとき
• クリックや入力の反応を改善したいとき
• 画像・広告・フォントの表示ずれ対策

曖昧な開発アイデアを対話で掘り下げ、取り組むべきかの判断と設計文書にまとめます。課題や代替案、状態の変化、データ構造を整理し、計画へ引き継ぎます。

• 機能案の背景にある課題を整理したいとき
• 開発・延期・縮小を判断したいとき
• 開発前に代替案を検討したいとき

検証やデバッグなどを任せる、独立した作業文脈を持つ補助エージェントを設計します。役割、呼び出し条件、手順、報告形式を整理し、再利用できる定義にまとめます。

• 完成した作業の独立した検証役の作成
• デバッグ専門エージェントの設計
• セキュリティ監査役の作成

React NativeとExpoでiOS・Android向けアプリを開発します。画面遷移や一覧表示、アニメーション、端末ごとの違いを扱い、性能も見直します。

• React NativeとExpoで画面を作りたいとき
• Expo Routerでの画面遷移の実装
• 一覧とアニメーションの性能改善

NestJSで、業務ごとに責任とデータを分けたモジュール型のバックエンドを設計・実装し、イベント連携や境界の検証まで進めるスキルです。

• NestJSのモジュール型バックエンド設計
• 責任を層に分けた業務モジュールの実装
• イベントによるモジュール連携

機能開発を計画・検証項目・実装・独立検証の順に進めるスキル。人が確認した要件をテストやコマンドの証拠に結び付け、実装者とは別のエージェントが確認します。

• レビュー用の機能計画を作りたいとき
• 承認済み要件を証拠付きの検証項目に変換
• 合意した検証項目に沿って機能を実装

現在のブランチに対応するGitHubのPRからレビュー指摘やコメントを集め、必要な修正を整理し、利用者が選んだ指摘への修正を進めるスキル。

• PRの未対応コメントを確認したいとき
• レビュー指摘の対応対象を選びたいとき
• 選んだ指摘を修正したいとき

決定済みの要件や設計文書を既存コードと照合し、具体的に確認できる完了条件、作業範囲、影響先、未決事項を備えた、実装者が着手しやすいタスクにまとめるスキル。

• 要件書を実装タスクにしたいとき
• 設計と既存コードの照合
• 動作に関する未決事項の洗い出し

決定済みの仕様やチケットから検証方法付きのチェックリストを作り、実装とテストを進めたうえで、独立した別のエージェントが全項目の達成状況を確認します。

• 合意済みの仕様に基づく機能実装
• チケットから検証可能な要件の抽出
• 別エージェントによる全要件の検証

機能の要件整理から設計、タスク分割、実装検証までを変更規模に合わせて進めます。仕様とテストの対応、小さな単位のコミット、判断記録も管理するスキルです。

• 新機能の要件を具体化したいとき
• 大きな開発を小さなタスクに分けたいとき
• 実装が仕様を満たすか確認したいとき

親フォルダや上位の名前空間に残ったクラスと、入れ子のコンポーネントを調べ、統合・分割・共有コードの移動による構造整理を計画し、実行します。

• 上位の名前空間に残るクラスの調査
• 入れ子構造の統合・分割案の比較
• 共有処理の専用コンポーネントへの移動

Railsの設計・実装・レビューを、モデル中心の業務ロジックや状態のレコード化など、独自の規約で進めます。命名やエラー処理、テストの方針も揃えます。

• RailsのモデルやDB変更を設計したいとき
• 状態変化を専用レコードで管理したいとき
• Railsコードの規約をレビューしたいとき

業務ルールを扱うコードを点検し、データを持つだけのクラスや外部に散らばった処理を見つけます。DDDの考え方に沿って、状態と操作をまとめる設計への改善を支援します。

• ドメインモデルをレビューしたいとき
• データだけを持つクラスの検出
• 業務ルールをモデルに集めたいとき

Shopifyのテーマやアプリ開発で、Liquidの記述・修正、API連携、独自ストア構築を支援。用途別の参照資料を使い、機能追加や性能改善を進めます。

• Liquidの記述やエラーを修正したいとき
• OS 2.0テーマのカスタマイズ
• ShopifyアプリやAPI連携の開発

不慣れなコードの処理の流れを調べ、バグ修正や機能追加、リファクタリングを進めるスキルです。調査で得た知識を.notebook/に残し、次回以降の作業にも引き継ぎます。

• 不慣れなコードのバグを調査・修正したいとき
• 既存の規約に沿って機能を追加したいとき
• 認証などの処理の流れを把握したいとき

Web画面のコードをガイドラインに沿って確認し、アクセシビリティやフォーム、操作時の反応などの問題を、ファイル名と行番号付きで簡潔に示すスキル。

• 公開前に画面のコードを点検したいとき
• キーボード操作とフォーカスの確認
• フォームのラベルと入力確認の点検

Figmaの画面や部品を、既存プロジェクトの規約に沿ったコードにします。画像や配色、余白を取得し、既存部品を再利用しながらデザインと照合して実装を進めます。

• Figmaのボタンを実装したいとき
• Figmaからダッシュボードを実装
• 既存部品をデザインに合わせて拡張

重要な技術上の決定について、背景・採用理由・代替案・利点と欠点を短い記録にまとめます。後から参加するメンバーにも判断の経緯が伝わるよう、日付や状態、連番を整理します。

• データベースを選んだ理由を残したいとき
• フレームワーク選定の経緯を残したいとき
• 認証方式の決定記録