| (同じ利用者による、間の3版が非表示) | |||
| 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>*.md</u> (ネスト配置も可) | | ファイル名 || <u>*.instructions.md</u> || <u>*.instructions.md</u> || <u>*.md</u> (ネスト配置も可) | ||
|- | |- | ||
| 配置場所 || <u>.github/instructions/</u> || <u>.claude/rules/</u> | | 配置場所 || <u>.github/instructions/</u> || <u>.github/instructions/</u> || <u>.claude/rules/</u> | ||
|- | |- | ||
| 適用範囲の指定方法 || < | | 適用範囲の指定方法 || <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> | ||
|- | |- | ||
| 複数ファイルの作成 || 可能 (用途別に複数ファイル) || | | 複数ファイルの作成 || 可能<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> コマンド) || | ||
* | * ターミナル (<code>claude</code> コマンド) | ||
* | * VS Code拡張 | ||
* JetBrains拡張 | |||
|} | |} | ||
</center> | </center> | ||
| 156行目: | 157行目: | ||
<syntaxhighlight lang="md"> | <syntaxhighlight lang="md"> | ||
--- | --- | ||
applyTo: " | applyTo: "globパターン" | ||
excludeAgent: " | excludeAgent: "エージェント名" | ||
--- | --- | ||
| 225行目: | 226行目: | ||
* 適用範囲 | * 適用範囲 | ||
*: ワークスペース内の全てのチャットリクエストに自動適用される。 | *: ワークスペース内の全てのチャットリクエストに自動適用される。 | ||
* | * パス固有カスタム指示 | ||
*: 対応している。 | *: 対応している。 | ||
<br> | <br> | ||
| 256行目: | 257行目: | ||
* 適用範囲 | * 適用範囲 | ||
*: 全てのチャットリクエストに自動適用される。 | *: 全てのチャットリクエストに自動適用される。 | ||
* | * パス固有カスタム指示 | ||
*: 対応している。 | *: 対応している。 | ||
<br> | <br> | ||
| 282行目: | 283行目: | ||
## ファイル構成 | ## ファイル構成 | ||
- | - コンポーネント毎のディレクトリ構成を使用する | ||
- | - ファイル名はPascalCaseとする (例: UserProfile.tsx) | ||
## ネーミング規則 | ## ネーミング規則 | ||
| 301行目: | 302行目: | ||
## React規約 | ## React規約 | ||
- | - 関数コンポーネントのみを使用する | ||
- | - Propsには必ずTypeScript型定義を記述する | ||
- | - useEffectの依存配列を必ず記述する | ||
- | - カスタムフックはuseで始まる名前にする | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<br> | <br> | ||
| 320行目: | 321行目: | ||
## ファイル構成 | ## ファイル構成 | ||
- | - モジュール毎のディレクトリ構成を使用する | ||
- | - ファイル名はsnake_caseとする (例: user_service.py) | ||
## ネーミング規則 | ## ネーミング規則 | ||
| 332行目: | 333行目: | ||
## コードスタイル | ## コードスタイル | ||
- PEP | - PEP 8に準拠する | ||
- インデント: 4スペース | - インデント: 4スペース | ||
- 最大行長: 88文字 (Black準拠) | - 最大行長: 88文字 (Black準拠) | ||
| 339行目: | 340行目: | ||
## エラーハンドリング | ## エラーハンドリング | ||
- 全てのAPI関数はtry- | - 全てのAPI関数はtry-exceptブロックを使用する | ||
- | - カスタム例外クラスを定義する | ||
- | - エラーログは適切なレベルで記録する | ||
## データベース | ## データベース | ||
- | - SQLインジェクション対策としてプリペアドステートメントを使用する | ||
- | - トランザクションは明示的に管理する | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<br> | <br> | ||
| 363行目: | 364行目: | ||
- RESTful APIの原則に従う | - RESTful APIの原則に従う | ||
- | - エンドポイントはリソース名を複数形で表現する (例: /users, /products) | ||
- | - HTTP動詞を正しく使用する (GET, POST, PUT, DELETE) | ||
## バリデーション | ## バリデーション | ||
- | - 全てのエンドポイントで入力バリデーションを実施する | ||
- | - リクエストボディのスキーマを定義する | ||
- バリデーションエラーは400 Bad Requestで返す | - バリデーションエラーは400 Bad Requestで返す | ||
## レスポンス形式 | ## レスポンス形式 | ||
- | - 一貫したエラーレスポンス形式を使用する | ||
- | - HTTPステータスコードを正しく使用する | ||
- JSON形式で返す | - JSON形式で返す | ||
## ドキュメント | ## ドキュメント | ||
- | - 全てのエンドポイントにOpenAPIコメントを記述する | ||
- リクエスト・レスポンスの例を含める | - リクエスト・レスポンスの例を含める | ||
</syntaxhighlight> | </syntaxhighlight> | ||
| 398行目: | 399行目: | ||
## 認証・認可 | ## 認証・認可 | ||
- | - JWT、OAuth2等の標準認証方式を使用する | ||
- | - パスワードはハッシュ化して保存する (bcrypt、Argon2等) | ||
- | - アクセストークンの有効期限を設定する | ||
- | - リフレッシュトークンを適切に管理する | ||
## データ保護 | ## データ保護 | ||
| 407行目: | 408行目: | ||
- 機密情報はログに記録しない | - 機密情報はログに記録しない | ||
- 外部通信はHTTPS必須 | - 外部通信はHTTPS必須 | ||
- | - SQLインジェクション対策を行う (プリペアドステートメント) | ||
- | - XSS対策を行う (入力のサニタイズ) | ||
- | - CSRF対策を行う (CSRFトークン) | ||
## 入力検証 | ## 入力検証 | ||
- | - 全てのユーザ入力を検証する | ||
- | - ホワイトリスト方式で検証する | ||
- | - ファイルアップロードは拡張子とMIMEタイプを検証する | ||
## アクセス制御 | ## アクセス制御 | ||
- | - 最小権限の原則を適用する | ||
- ロールベースアクセス制御 (RBAC) | - ロールベースアクセス制御 (RBAC) を使用する | ||
- | - センシティブな操作はログに記録する | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<br><br> | <br><br> | ||
| 512行目: | 513行目: | ||
<br> | <br> | ||
良い例を以下に示す。<br> | 良い例を以下に示す。<br> | ||
* <u> | * <u>全ての新規コードにTypeScriptを使用すること</u> | ||
* <u> | * <u>全ての関数にJSDocコメントを記述すること</u> | ||
* <u> | * <u>継承よりコンポジションを優先すること</u> | ||
<br> | <br> | ||
悪い例を以下に示す。<br> | 悪い例を以下に示す。<br> | ||
* <u> | * <u>TypeScriptを使用するのが好ましい</u> | ||
* <u> | * <u>コメントの追加を検討すること</u> | ||
* <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を使用する | ||
- | - 全ての公開APIにJSDocコメントを記述する | ||
- エラーハンドリングにはtry- | - エラーハンドリングにはtry-catchブロックを使用する | ||
</syntaxhighlight> | </syntaxhighlight> | ||
<br><br> | <br><br> | ||