[Skill 名] no-hardcoding

ハードコーディング禁止ポリシー

コードにハードコーディングされた値を禁止し、定数/環境変数/設定ファイルの使用を強制するスキルです。

コア原則

"コードに直接値を書き込んだ瞬間、変更がデプロイされる。"

ルール

検出パターン

Magic Numbers

// ❌ BAD: 意味不明確
if (users.length > 100) { ... }
setTimeout(callback, 3000);
const tax = price * 0.1;

// ✅ GOOD: 意味明確
const MAX_USERS = 100;
const DEBOUNCE_MS = 3000;
const TAX_RATE = 0.1;

if (users.length > MAX_USERS) { ... }
setTimeout(callback, DEBOUNCE_MS);
const tax = price * TAX_RATE;

Magic Strings

// ❌ BAD: 文字列の繰り返し、誤入力のリスク
if (status === 'pending') { ... }
if (status === 'pending') { ... }  // 別の場所で再度使用

// ✅ GOOD: 定数または enum
enum Status {
  PENDING = 'pending',
  APPROVED = 'approved',
  REJECTED = 'rejected',
}

if (status === Status.PENDING) { ... }

URLs/Endpoints

// ❌ BAD: URLのハードコーディング
const response = await fetch('https://api.example.com/users');

// ✅ GOOD: 環境変数
const API_URL = process.env.NEXT_PUBLIC_API_URL;
const response = await fetch(`${API_URL}/users`);

クレデンシャル (絶対禁止)

// ❌ CRITICAL: 絶対禁止 - セキュリティ上の脅威
const apiKey = 'sk-1234567890abcdef';
const password = 'admin123';
const dbConnection = 'mongodb://user:pass@host:27017';

// ✅ GOOD: 環境変数の使用
const apiKey = process.env.API_KEY;
const password = process.env.DB_PASSWORD;
const dbConnection = process.env.DATABASE_URL;

タイムアウト/遅延

// ❌ BAD: ハードコーディングされたタイムアウト
await page.waitForTimeout(5000);
time.sleep(3);

// ✅ GOOD: 条件ベースまたは定数
const ANIMATION_DURATION = 300;
await page.waitForSelector('#content');  // 条件ベース
await delay(ANIMATION_DURATION);          // 定数の使用

ファイル構成

src/
├── constants/
│   ├── index.ts         # Re-exports
│   ├── api.ts           # API関連定数
│   ├── ui.ts            # UI関連定数
│   └── business.ts      # ビジネスロジック定数
├── config/
│   ├── index.ts
│   └── env.ts           # 環境変数検証および型定義
└── types/
    └── enums.ts         # Enum定義

constants の例

// constants/api.ts
export const API = {
  TIMEOUT_MS: 30000,
  RETRY_COUNT: 3,
  ENDPOINTS: {
    USERS: '/api/users',
    POSTS: '/api/posts',
  },
} as const;

// constants/ui.ts
export const UI = {
  DEBOUNCE_MS: 300,
  ANIMATION_DURATION_MS: 200,
  MAX_ITEMS_PER_PAGE: 20,
  BREAKPOINTS: {
    MOBILE: 768,
    TABLET: 1024,
    DESKTOP: 1280,
  },
} as const;

環境変数検証

// config/env.ts
const requiredEnvVars = [
  'DATABASE_URL',
  'API_KEY',
  'NEXT_PUBLIC_API_URL',
] as const;

export function validateEnv() {
  for (const envVar of requiredEnvVars) {
    if (!process.env[envVar]) {
      throw new Error(`Missing required env var: ${envVar}`);
    }
  }
}

export const env = {
  DATABASE_URL: process.env.DATABASE_URL!,
  API_KEY: process.env.API_KEY!,
  API_URL: process.env.NEXT_PUBLIC_API_URL!,
} as const;

検出コマンド

# Magic Numbers 検索 (一般的なパターン)
grep -rn "[^a-zA-Z][0-9]\{3,\}[^a-zA-Z0-9]" --include="*.ts" --include="*.tsx" src/

# ハードコーディングされたURL検索
grep -rn "https\?://" --include="*.ts" --include="*.tsx" src/ | grep -v "node_modules"

# 潜在的なクレデンシャル検索
grep -rn "password\|apiKey\|secret\|token" --include="*.ts" --include="*.tsx" src/ | grep -v "\.d\.ts"

ワークフロー

1. コードレビュー時

ハードコーディング検出:
1. Magic Number/String 検索
2. URL/パスのハードコーディング確認
3. クレデンシャルのハードコーディング確認 (最優先)

違反発見時:
→ 定数抽出を推奨
→ 環境変数の使用を案内
→ .env.example の更新確認

2. 新機能作成時

値使用前のチェック:
- この値は変更される可能性があるか？ → 環境変数/config
- この値は複数の場所で使用されるか？ → 定数
- この値は機密情報か？ → 環境変数 + secrets
- この値は意味を持つか？ → 定数 (名前で意味を付与)

例外

許可されるケース

// 0, 1, -1 (一般的に明確な意味)
const index = array.indexOf(item);
if (index === -1) { ... }

// 配列の最初/最後の要素
const first = array[0];
const last = array[array.length - 1];

// 明確な数学的演算
const half = total / 2;
const percentage = (part / whole) * 100;

チェックリスト

• [ ] Magic Number がないこと
• [ ] Magic String がないこと (繰り返し文字列)
• [ ] URL のハードコーディングがないこと
• [ ] クレデンシャルのハードコーディングがないこと
• [ ] 定数ファイルに整理されていること
• [ ] .env.example が更新されていること
• [ ] 環境変数検証ロジックがあること