「GitHub Copilotの設定 - パス固有カスタム指示」の版間の差分

 
(同じ利用者による、間の4版が非表示)
79行目: 79行目:
<center>
<center>
{| class="wikitable"
{| class="wikitable"
|+ GitHub Copilot パス固有カスタム指示 と Claude Codeの比較
|+ GitHub Copilot / GitHub Copilot CLI パス固有カスタム指示 と Claude Codeの比較
! 項目 !! GitHub Copilot !! Claude Code
! 項目 !! GitHub Copilot !! GitHub Copilot CLI !! Claude Code
|-
|-
| ファイル名 || <u>*.instructions.md</u> || <u>CLAUDE.md</u> (ネスト配置)
| ファイル名 || <u>*.instructions.md</u> || <u>*.instructions.md</u> || <u>*.md</u> (ネスト配置も可)
|-
|-
| 配置場所 || <u>.github/instructions/</u> || 任意のディレクトリ (プロジェクトルートまたはサブディレクトリ)
| 配置場所 || <u>.github/instructions/</u> || <u>.github/instructions/</u> || <u>.claude/rules/</u>
|-
|-
| 適用範囲の指定方法 || <u>applyTo</u>プロパティでglobパターン指定 || ディレクトリ階層による暗黙的適用<br>(そのディレクトリ以下に適用)
| 適用範囲の指定方法 || <code>applyTo</code> プロパティでglobパターン指定 || <code>applyTo</code> プロパティでglobパターン指定 || フロントマターの <code>paths</code> フィールドでglobパターン指定
|-
|-
| globパターン対応 || 対応<br>例: <u>**/*.ts</u>, <u>src/**/*.py</u> || 非対応
| globパターン対応 || 対応<br>例: <u>**/*.ts</u>, <u>src/**/*.py</u> || 対応<br>例: <u>**/*.ts</u>, <u>src/**/*.py</u> || 対応<br>例: <u>**/*.ts</u>, <u>src/api/**/*.ts</u>
|-
|-
| 複数ファイルの作成 || 可能 (用途別に複数ファイル) || ディレクトリごとに1ファイル
| 複数ファイルの作成 || 可能<br>(用途別に複数ファイル) || 可能<br>(用途別に複数ファイル) || 可能<br>(用途別に複数ファイル、サブディレクトリでの整理も可)
|-
|-
| フロントマター || YAML形式で設定<br><code>applyTo</code>, <code>excludeAgent</code> || なし
| フロントマター || YAML形式で設定<br><code>applyTo</code>, <code>excludeAgent</code> || YAML形式で設定<br><code>applyTo</code>, <code>excludeAgent</code> || YAML形式で設定<br><code>paths</code>
|-
|-
| エージェント除外設定 || <code>excludeAgent</code>プロパティで指定可能 || 非対応
| エージェント除外設定 || <code>excludeAgent</code> プロパティで指定可能 || <code>excludeAgent</code> プロパティで指定可能 || 非対応
|-
|-
| 継承・マージ || 親ディレクトリの指示と併用 || 親ディレクトリのCLAUDE.mdと自動マージ
| 継承・マージ || 親ディレクトリの指示と併用 || 親ディレクトリの指示と併用 || 親ディレクトリのCLAUDE.mdと自動マージ
|-
|-
| 対応環境 ||  
| 対応環境 ||
* VS Code
* VS Code
* Visual Studio
* Visual Studio
* JetBrains
* JetBrains
* GitHub.com
* GitHub.com
|  
| ターミナル (<code>gh copilot</code> コマンド) ||
* Claude Code CLI
* ターミナル (<code>claude</code> コマンド)
* 各種IDE拡張
* VS Code拡張
* JetBrains拡張
|}
|}
</center>
</center>
156行目: 157行目:
  <syntaxhighlight lang="md">
  <syntaxhighlight lang="md">
  ---
  ---
  applyTo: "glob_pattern"
  applyTo: "globパターン"
  excludeAgent: "agent_name"
  excludeAgent: "エージェント名"
  ---
  ---
   
   
225行目: 226行目:
* 適用範囲
* 適用範囲
*: ワークスペース内の全てのチャットリクエストに自動適用される。
*: ワークスペース内の全てのチャットリクエストに自動適用される。
*  
* パス固有カスタム指示
*: 対応している。
*: 対応している。
<br>
<br>
256行目: 257行目:
* 適用範囲
* 適用範囲
*: 全てのチャットリクエストに自動適用される。
*: 全てのチャットリクエストに自動適用される。
*  
* パス固有カスタム指示
*: 対応している。
*: 対応している。
<br>
<br>
282行目: 283行目:
  ## ファイル構成
  ## ファイル構成
   
   
  - コンポーネント毎のディレクトリ構成を使用
  - コンポーネント毎のディレクトリ構成を使用する
  - ファイル名はPascalCase (例: UserProfile.tsx)
  - ファイル名はPascalCaseとする (例: UserProfile.tsx)
   
   
  ## ネーミング規則
  ## ネーミング規則
301行目: 302行目:
  ## React規約
  ## React規約
   
   
  - 関数コンポーネントのみを使用
  - 関数コンポーネントのみを使用する
  - Propsには必ずTypeScript型定義を記述
  - Propsには必ずTypeScript型定義を記述する
  - useEffectの依存配列を必ず記述
  - useEffectの依存配列を必ず記述する
  - カスタムフックは use で始まる名前
  - カスタムフックはuseで始まる名前にする
  </syntaxhighlight>
  </syntaxhighlight>
<br>
<br>
320行目: 321行目:
  ## ファイル構成
  ## ファイル構成
   
   
  - モジュール毎のディレクトリ構成を使用
  - モジュール毎のディレクトリ構成を使用する
  - ファイル名はsnake_case (例: user_service.py)
  - ファイル名はsnake_caseとする (例: user_service.py)
   
   
  ## ネーミング規則
  ## ネーミング規則
332行目: 333行目:
  ## コードスタイル
  ## コードスタイル
   
   
  - PEP 8に準拠
  - PEP 8に準拠する
  - インデント: 4スペース
  - インデント: 4スペース
  - 最大行長: 88文字 (Black準拠)
  - 最大行長: 88文字 (Black準拠)
339行目: 340行目:
  ## エラーハンドリング
  ## エラーハンドリング
   
   
  - 全てのAPI関数はtry-exceptブロックを使用
  - 全てのAPI関数はtry-exceptブロックを使用する
  - カスタム例外クラスを定義
  - カスタム例外クラスを定義する
  - エラーログは適切なレベルで記録
  - エラーログは適切なレベルで記録する
   
   
  ## データベース
  ## データベース
   
   
  - SQLインジェクション対策としてプリペアドステートメントを使用
  - SQLインジェクション対策としてプリペアドステートメントを使用する
  - トランザクションは明示的に管理
  - トランザクションは明示的に管理する
  </syntaxhighlight>
  </syntaxhighlight>
<br>
<br>
363行目: 364行目:
   
   
  - RESTful APIの原則に従う
  - RESTful APIの原則に従う
  - エンドポイントはリソース名を複数形で表現 (例: /users, /products)
  - エンドポイントはリソース名を複数形で表現する (例: /users, /products)
  - HTTP動詞を正しく使用 (GET, POST, PUT, DELETE)
  - HTTP動詞を正しく使用する (GET, POST, PUT, DELETE)
   
   
  ## バリデーション
  ## バリデーション
   
   
  - 全てのエンドポイントで入力バリデーションを実施
  - 全てのエンドポイントで入力バリデーションを実施する
  - リクエストボディのスキーマを定義
  - リクエストボディのスキーマを定義する
  - バリデーションエラーは400 Bad Requestで返す
  - バリデーションエラーは400 Bad Requestで返す
   
   
  ## レスポンス形式
  ## レスポンス形式
   
   
  - 一貫したエラーレスポンス形式を使用
  - 一貫したエラーレスポンス形式を使用する
  - HTTPステータスコードを正しく使用
  - HTTPステータスコードを正しく使用する
  - JSON形式で返す
  - JSON形式で返す
   
   
  ## ドキュメント
  ## ドキュメント
   
   
  - 全てのエンドポイントにOpenAPIコメントを記述
  - 全てのエンドポイントにOpenAPIコメントを記述する
  - リクエスト・レスポンスの例を含める
  - リクエスト・レスポンスの例を含める
  </syntaxhighlight>
  </syntaxhighlight>
398行目: 399行目:
  ## 認証・認可
  ## 認証・認可
   
   
  - JWT、OAuth2等の標準認証方式を使用
  - JWT、OAuth2等の標準認証方式を使用する
  - パスワードはハッシュ化して保存 (bcrypt、Argon2等)
  - パスワードはハッシュ化して保存する (bcrypt、Argon2等)
  - アクセストークンの有効期限を設定
  - アクセストークンの有効期限を設定する
  - リフレッシュトークンの適切な管理
  - リフレッシュトークンを適切に管理する
   
   
  ## データ保護
  ## データ保護
407行目: 408行目:
  - 機密情報はログに記録しない
  - 機密情報はログに記録しない
  - 外部通信はHTTPS必須
  - 外部通信はHTTPS必須
  - SQLインジェクション対策 (プリペアドステートメント)
  - SQLインジェクション対策を行う (プリペアドステートメント)
  - XSS対策 (入力のサニタイズ)
  - XSS対策を行う (入力のサニタイズ)
  - CSRF対策 (CSRFトークン)
  - CSRF対策を行う (CSRFトークン)
   
   
  ## 入力検証
  ## 入力検証
   
   
  - 全てのユーザ入力を検証
  - 全てのユーザ入力を検証する
  - ホワイトリスト方式で検証
  - ホワイトリスト方式で検証する
  - ファイルアップロードは拡張子とMIMEタイプを検証
  - ファイルアップロードは拡張子とMIMEタイプを検証する
   
   
  ## アクセス制御
  ## アクセス制御
   
   
  - 最小権限の原則を適用
  - 最小権限の原則を適用する
  - ロールベースアクセス制御 (RBAC) を使用
  - ロールベースアクセス制御 (RBAC) を使用する
  - センシティブな操作はログに記録
  - センシティブな操作はログに記録する
  </syntaxhighlight>
  </syntaxhighlight>
<br><br>
<br><br>
512行目: 513行目:
<br>
<br>
良い例を以下に示す。<br>
良い例を以下に示す。<br>
* <u>Use TypeScript for all new code.</u>
* <u>全ての新規コードにTypeScriptを使用すること</u>
* <u>All functions must have JSDoc comments.</u>
* <u>全ての関数にJSDocコメントを記述すること</u>
* <u>Prefer composition over inheritance.</u>
* <u>継承よりコンポジションを優先すること</u>
<br>
<br>
悪い例を以下に示す。<br>
悪い例を以下に示す。<br>
* <u>It would be nice to use TypeScript.</u>
* <u>TypeScriptを使用するのが好ましい</u>
* <u>Consider adding comments.</u>
* <u>コメントの追加を検討すること</u>
* <u>Inheritance might not be the best choice.</u>
* <u>継承は最良の選択肢ではないかもしれない</u>
<br>
<br>
==== コード例を含める ====
==== コード例を含める ====
530行目: 531行目:
  関数名はcamelCaseを使用する。
  関数名はcamelCaseを使用する。
   
   
  ## 良い例:
  ## 良い例
   
   
  ```typescript
  ```typescript
  function getUserById(id: string): User {
  function getUserById(id: string): User {
  // 実装
    // 実装
  }
  }
  ```
  ```
   
   
  ## 悪い例:
  ## 悪い例
   
   
  ```typescript
  ```typescript
  function GetUserById(id: string): User {
  function GetUserById(id: string): User {
  // 実装
    // 実装
  }
  }
  ```
  ```
577行目: 578行目:
   
   
  - 関数は50行以内に抑える
  - 関数は50行以内に抑える
  - 変数名はcamelCaseを使用
  - 変数名はcamelCaseを使用する
  - 全ての公開APIにJSDocコメントを記述
  - 全ての公開APIにJSDocコメントを記述する
  - エラーハンドリングにはtry-catchブロックを使用
  - エラーハンドリングにはtry-catchブロックを使用する
  </syntaxhighlight>
  </syntaxhighlight>
<br><br>
<br><br>