キュー・エンジニアリングの基本原則
効果的なコミュニケーション戦略は、AIコードアシスタントとの共同作業において非常に重要である。技術的には有能だが、あなたのプロジェクトの背景について何も知らない同僚を指導しているとき、彼が問題を理解し解決するのに十分な情報を提供する必要があるとしよう。
主要原則
適切な文脈情報を提供する
- 使用したプログラミング言語とフレームワークのバージョン
- 特定のエラーメッセージとスタックトレース
- コードの期待される機能と実際のパフォーマンス
- 関連するプロジェクトの制約と技術スタック
具体的な目標の明確化 曖昧な表現は避け、どのような問題を解決しようとしているのかを明確に述べる：
❌ “让我的代码更好” ✅ “重构这个函数以提高可读性，减少代码重复，并使用ES6语法”
複雑なタスクへの段階的アプローチ 大きな仕事を小さなステップに分解する：
1.最初にReactコンポーネントの基本構造を生成します。
2.次に状態管理ロジックを追加する。
3.最後に、APIコールとエラー処理を統合する。
入力と出力の例を示す 望ましい行動は、具体的な例を通して説明される：
// 期待値： formatPrice(2.5) は "$2.50" を返す。
// 期待値：formatPrice(100)は "$100.00 "を返す。
デバッグ・シナリオの効率的なヒント
実例：React Hookの依存性の問題
問題コード
const UserProfile = ({ userId }) => {.
const [user, setUser] = useState(null)；
const [loading, setLoading] = useState(true)；
useEffect(())=>{を使用します。
fetchUser(userId).then(setUser).finally(() => setLoading(false))；
}, [userId, setUser, setLoading]); // ここが問題です。
return loading ? <div>読み込み中...</div> : <div>{ユーザー?｝</div>;
};
❌ 低效提示：
useEffectに問題があり、コンポーネントが再レンダリングを繰り返します！
✅ 高效提示：
Reactコンポーネントに無限の再レンダリングの問題があります：
期待される動作：userIdが変更されたときにユーザーデータを一度だけ取得する。
実際の動作: コンポーネントが無限ループで再レンダリングされる
エラーメッセージ: Warning: 最大更新深度を超えました。
コードは上記のとおりですが、問題はuseEffectの依存関係の配列にあります。依存関係にsetUserとsetLoadingを追加する必要がありますか？なぜ無限ループが発生するのでしょうか？React Hookの依存関係のベストプラクティスについて教えてください。
デバッグ・チップ・テンプレート
問題の説明： [問題の簡単な説明］
期待される動作: [コードがすべきこと］
実際の動作: [現在起こっていること］
エラーメッセージ: [完全なエラーメッセージ].
関連するコード: [コードスニペットを提供する].
技術環境: [言語バージョン、フレームワークバージョン］
シナリオ再構築のための体系的アプローチ
リファクタリングの目的を明確にする
リファクタリングは、改善の方向性を明確にして行うべきである：
| 復興目標 | 先端テンプレート | 典型例 |
|---|---|---|
| パフォーマンス最適化 | "【特定のパフォーマンス指標】のためにこの機能を最適化する" | "O(n²)の複雑さをなくすためにこの関数を最適化する" |
| コードのクリーンアップ | "【可読性／保守性】を向上させるリファクタリング" | "この関数をリファクタリングしてネストを減らし、ネーミングを改善する" |
| 技術のアップグレード | "【古い技術】を【新しい技術】として書き換える" | "フックを使ってクラス・コンポーネントをファンクション・コンポーネントとして書き換える" |
実践事例：パフォーマンスの最適化 リファクタリング
元のコード（O(n²)問題あり）：
function processUserData(users, orders) {
const result = [];
for (let user of users) {
const userOrders = [];
for (let order of orders) {
if (order.userId === user.id) {
userOrders.push(order);
}
}
const totalSpent = userOrders.reduce((sum, order) => sum + order.amount, 0);
result.push({ ...user, orders: userOrders, totalSpent });
}
return result;
}
✅ 性能优化提示：
以下の関数はO(n²)の時間複雑度問題を持ち、O(n)に最適化される必要がある：
[コード］
最適化の要件
1.入れ子ループを排除し、O(1)ルックアップにMapを使用する。
2. 繰り返し計算を減らし、データ集計を完了するためにトラバーサルする。
3. 読みやすいコードを維持し、パフォーマンスコメントを追加する。
4. エッジケースの処理：注文のないユーザー
リファクタリングしたコードを提供し、最適化のアイデアを説明してください。
機能開発のための進歩的なヒント
アーキテクチャから実装までのレイヤー開発
ステップ1：建築設計
マルチステップ・フォームのための状態管理アーキテクチャの設計：
機能要件：
- 3ステップフォームプロセスのサポート
- リアルタイムの検証とデータの永続化
- 前方/後方ナビゲーション
テクノロジースタック: React + TypeScript + React Hook Form
提供してください：
- ステート構造デザイン
- メインフックのインターフェース設計
- 状態遷移ロジック
ステップ2：コアの実現
前のアーキテクチャ設計に基づいて、コアの useMultiStepForm Hook を実装する：
要件
1. 現在のステップとフォーム・データを管理する。
2. nextStep、prevStep、updateStepDataメソッドを提供する。
3. フォーム検証ロジックを統合する。
4. localStorageに自動的に保存される。
完全なHook実装コードを提供してください。
機能開発テンプレート
## タスクの説明
[解決しようとしている問題］
##技術環境
- 言語/フレームワーク
- バージョン情報
- 関連ライブラリ
## 特定要件。
- 機能要件：
- パフォーマンス要件：
- コードスタイル：
## 制約事項
- 使用できない：
- 従わなければならない：
## 望ましい出力
[望ましい結果の形式を記述する。］
高度なプロンプティングのヒントとよくある誤解
効果的なプロンプティングのための10のヒント
| 技巧 | テンプレート | アプリケーションシナリオ |
|---|---|---|
| ペルソナ | "あなたは上級の[言語]開発者です、[タスク]をお願いします" | コードレビュー、アーキテクチャの推奨 |
| 問題診断 | "これは次のコードの問題です：[説明]、原因は何ですか？" | バグの場所 |
| ドライバー例 | 「関数入力[X]は[Y]を出力すべきである。 | 機能開発 |
| 一歩一歩 | 「この関数を一行ずつ分析して、変数の値はどのように変化するか？ | ロジック・デバッグ |
| ある程度制限する | 「X]を避け、[Y]を使用し、[Z]を最適化してください。 | プロジェクト仕様書の遵守 |
よくある誤解と解決策
1.情報過多 ❌ 一次性要求解决多个复杂问题 ✅ 分步骤逐个解决
2.情報不足 ❌ “修复我的代码” ✅ 提供错误信息、预期行为、相关代码
3.目的の曖昧さ ❌ “让代码更好” ✅ “提高可读性并减少内存使用”
コード・レビュー警告モード
シニア・テクニカル・アーキテクトとして、以下のコードを詳細にレビューする：
[コード内容］
レビューの次元
1. アーキテクチャ設計：SOLID の原則に準拠しているか？
2.パフォーマンスへの配慮：パフォーマンスのボトルネックはないか？
3.セキュリティ：セキュリティの脆弱性はないか？
4.保守性：コードは理解しやすく、修正しやすいか？
具体的な問題点、提案、改善例をご記入ください。
ベストプラクティスの推奨
継続的反復的改善
ラウンド1：基本的な解決策を得る
第2ラウンド：最適化と改善
ラウンド 3: エラー処理とテストの追加
検証と学習
- AIが生成したコードを常に検証する
- 正しい機能を保証するためのテスト実行
- AIの解決策を分析する
- 効果的なキューイングのパターンを文書化する
結語
キュー・エンジニアリングは、実践の中で磨かれるべき実践的なスキルである。明確なコミュニケーション、具体的な要件、忍耐強い反復によって、プログラミングの効率を大幅に向上させることができる。AIヘルパーは、賢いが明確なガイダンスが必要なパートナーのようなもので、上手に促すことで、プログラミングの旅の有能なアシスタントになることを覚えておいてほしい。
