AI開発の効率を数字で公開します

「AIで開発って、実際どれくらい効率いいの？」

これ、聞かれることがあります。

抽象的な話より、数字で見たほうがわかりやすいですよね。

今日は、僕の開発実績を具体的な数字で公開します。

ただし最初に言っておくと、これは「AIに任せれば何でもできる」という話ではありません。構想を練り、仕様を決め、最終確認をするのは人間の仕事。その上で「手を動かす作業」をAIが代行しているからこそ、この数字が出ています。

透明性を大切にしているので、良い数字も悪い数字も隠さず出します。

---

この記事でわかること

• 作ったサービスの数と規模
• 開発にかかった時間とコスト
• バグ修正・品質管理の実績 -技術スタックと品質保証の仕組み(技術者向け詳細)

---

作ったサービスの数

Claude Codeを使い始めてから、以下のサービスを開発しました。

🌐 コーポレートサイト 会社の顔となるWebサイト。お問い合わせフォーム、CMS機能付き。

📊 独自CRM(顧客管理システム) 商談管理、契約管理、請求連携まで。外部SaaSと連携。

✍️ AI記事生成システム note、WordPressに自動投稿できる記事生成ツール。

📝 日記アプリ 個人用の日記管理アプリ。音声入力対応。

合計：4つのサービスを開発中または運用中です。

技術スタックの詳細

すべてのプロジェクトで共通して使用している技術スタックを紹介します：

レイヤー	技術	選定理由
フロントエンド	Next.js 14 (App Router)	React Server Components対応、高速
スタイリング	Tailwind CSS + shadcn/ui	ユーティリティファースト、再利用性
バックエンド	Supabase	PostgreSQL + 認証 + RLS
ホスティング	Vercel	自動デプロイ、CDN、無料枠充実
テスト	Playwright	E2Eテスト、クロスブラウザ対応
型チェック	TypeScript	型安全性、開発効率
CI/CD	GitHub Actions	自動テスト、デプロイパイプライン

---

開発にかかった時間

それぞれのサービスにかかった時間の目安です。

コーポレートサイト：約2週間 (従来の外注なら1〜2ヶ月が相場)

独自CRM：約1ヶ月(継続改善中) (従来なら3〜6ヶ月かかる規模)

AI記事生成システム：約3週間 (API連携含む複雑な機能)

体感として、従来の3〜5倍のスピードで開発できています。

---

【技術解説】開発スピードを支える自動化

なぜこれほどの速度で開発できるのか、技術的な背景を説明します。

1. CLAUDE.mdによる自動処理

プロジェクトルートに配置したCLAUDE.mdファイルで、Claude Codeの振る舞いを制御しています：

## 自動処理ルール

### 🔴 自動実行フロー

| タイミング | 自動実行する処理 |
|-----------|----------------|
| 機能実装完了時 | テスト生成 → テスト実行 → 失敗時は自動修正 |
| PR作成前 | セキュリティ監査(XSS, SQLi, 認証バイパス) |
| デプロイ前 | ビルド確認 → テスト全実行 → 問題なければデプロイ |
| DB変更後 | RLSポリシー確認 → 型生成 |

これにより、「ログイン機能を作って」という1つの指示で、以下が自動実行されます：

1. Supabaseで認証機能を設定
2. ログイン画面のUIを実装
3. Playwrightでテストを自動生成
4. テスト実行・失敗時は自動修正
5. GitHubにプッシュ
6. Vercelで自動デプロイ

2. MCP(Model Context Protocol)による外部連携

Claude Codeは以下の外部サービスと直接連携しています：

{
  "mcpServers": {
    "github": {
      "command": "npx",
      "args": ["-y", "@modelcontextprotocol/server-github"],
      "env": {
        "GITHUB_PERSONAL_ACCESS_TOKEN": "${GITHUB_PERSONAL_ACCESS_TOKEN}"
      }
    },
    "supabase": {
      "command": "npx",
      "args": ["-y", "@supabase/mcp-server-supabase@latest"],
      "env": {
        "SUPABASE_ACCESS_TOKEN": "${SUPABASE_ACCESS_TOKEN}"
      }
    }
  }
}

これで可能になること：

• データベーススキーマの確認・変更
• RLSポリシーの設定
• TypeScript型の自動生成
• GitHubへのコミット・PR作成

---

コストの話(正直に書きます)

Claude Codeの利用にはAPI費用がかかります。これは自社の社内開発(内製)のケースですが、正直に公開します。

月間API費用：約3〜5万円(開発が活発な月は高くなる傾向)

ただし注意点があります。これはあくまで「AIへの課金」だけの話。自社プロダクトの内製開発なら、構想からチェックまで自分でやるのでこの費用感で済みます。

一方、お客様向けの受託開発となると話は変わります。要件を整理するディレクション、仕様を詰める打ち合わせ、品質チェック、納品後のサポート。これらは人間がやる仕事なので、その人件費は別途かかります。

それでも、従来のやり方と比べれば開発コストは1/3程度に圧縮できています。

コスト内訳の詳細

項目	月額費用	備考
Claude Code Max	$200(約3万円)	API無制限プラン
Vercel	$20〜	Pro以上推奨
Supabase	$25〜	Pro以上推奨
GitHub	無料	パブリックリポジトリ
合計	約3.5〜5万円	外部サービス込み

従来のエンジニア人件費(月50〜80万円)や外注費(1機能あたり30〜100万円)と比較すると、大幅なコスト削減です。

---

バグ・不具合の発生状況

良い話ばかりではありません。バグも当然発生します。

直近1ヶ月のバグ発生：約15件

内訳：

• 軽微な表示崩れ：8件
• 機能が動かない：5件
• セキュリティ関連：2件

重要なのは、どう対処したかです。

---

【技術解説】バグ修正の自動化フロー

バグが見つかったら、以下のフローで修正します。

CLAUDE.mdでのSubagent自動起動設定

### 📋 Subagent自動起動テーブル

| トリガー(キーワード) | 起動するAgent | 処理内容 |
|-----------------------|--------------|---------|
| 「なぜ」「エラー」「動かない」 | Explore | エラー原因を徹底調査 |
| 「セキュリティ」「脆弱性」 | Explore | OWASP Top 10を中心に調査 |
| 「デプロイ」「本番反映」 | general-purpose | テスト→ビルド→デプロイ |

実際のバグ修正例

僕：「ログインボタンが動かない」

Claude Code(Explore Agent自動起動)：
├─ ブラウザコンソールログを確認
├─ ネットワークリクエストを調査
├─ Supabase認証設定を確認
├─ 原因特定：環境変数の設定漏れ
├─ .env.localに変数を追加
├─ Playwrightでログインテストを実行
├─ テスト成功を確認
└─ 「修正完了しました。環境変数の設定漏れが原因でした」

平均修正時間：30分〜2時間

従来なら「報告→調査→見積→修正→テスト→納品」で数日かかるところを、数時間で完了できます。

---

テストの実行回数と品質保証

品質を担保するために、自動テストを頻繁に実行しています。

月間テスト実行回数：約200回以上

Playwright設定の詳細

// playwright.config.ts
import { defineConfig, devices } from '@playwright/test';

export default defineConfig({
  testDir: './tests',
  fullyParallel: true,
  forbidOnly: !!process.env.CI,
  retries: process.env.CI ? 2 : 0,
  workers: process.env.CI ? 1 : undefined,
  reporter: [
    ['html'],
    ['json', { outputFile: 'test-results/results.json' }]
  ],
  use: {
    baseURL: 'http://localhost:3000',
    trace: 'on-first-retry',
    screenshot: 'only-on-failure',
    video: 'retain-on-failure',
  },
  projects: [
    { name: 'chromium', use: { ...devices['Desktop Chrome'] } },
    { name: 'firefox', use: { ...devices['Desktop Firefox'] } },
    { name: 'webkit', use: { ...devices['Desktop Safari'] } },
    { name: 'production', use: { baseURL: 'https://本番URL' } },
  ],
});

自動テストの例

import { test, expect } from '@playwright/test';

test.describe('ログイン機能', () => {
  test('正常なログイン', async ({ page }) => {
    await page.goto('/login');
    
    // フォーム入力
    await page.fill('[data-testid="email"]', 'test@example.com');
    await page.fill('[data-testid="password"]', 'password123');
    
    // ログイン実行
    await page.click('[data-testid="login-button"]');
    
    // リダイレクト確認
    await expect(page).toHaveURL('/dashboard');
    
    // Consoleエラーがないことを確認
    const consoleErrors: string[] = [];
    page.on('console', msg => {
      if (msg.type() === 'error') {
        consoleErrors.push(msg.text());
      }
    });
    expect(consoleErrors).toHaveLength(0);
  });

  test('無効なパスワードでエラー表示', async ({ page }) => {
    await page.goto('/login');
    await page.fill('[data-testid="email"]', 'test@example.com');
    await page.fill('[data-testid="password"]', 'wrong');
    await page.click('[data-testid="login-button"]');
    
    await expect(page.locator('[data-testid="error-message"]')).toBeVisible();
    await expect(page).toHaveURL('/login');
  });
});

---

【技術解説】CI/CDパイプライン

GitHub Actionsでの自動テスト・デプロイ設定を紹介します。

name: CI/CD Pipeline

on:
  push:
    branches: [main, develop]
  pull_request:
    branches: [main]

jobs:
  quality-check:
    runs-on: ubuntu-latest
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      
      - name: Install dependencies
        run: npm ci
      
      - name: TypeScript Type Check
        run: npm run type-check
      
      - name: ESLint
        run: npm run lint
      
      - name: Build
        run: npm run build

  e2e-tests:
    runs-on: ubuntu-latest
    needs: quality-check
    steps:
      - uses: actions/checkout@v4
      - uses: actions/setup-node@v4
        with:
          node-version: '20'
          cache: 'npm'
      
      - name: Install dependencies
        run: npm ci
      
      - name: Install Playwright browsers
        run: npx playwright install --with-deps
      
      - name: Run E2E tests
        run: npx playwright test
      
      - name: Upload test report
        uses: actions/upload-artifact@v4
        if: always()
        with:
          name: playwright-report
          path: playwright-report/
          retention-days: 30

このワークフローにより、以下が自動実行されます：

1.TypeScript型チェック: 型エラーがあればマージをブロック 2.ESLint静的解析: コード品質を担保 3.ビルド確認: 本番デプロイ可能か確認 4.E2Eテスト: 全機能の動作確認 5.テストレポート保存: 失敗時の調査用

---

コードの規模

参考までに、コードの規模も公開します。

全プロジェクト合計：約5万行以上

これを非エンジニアが「AIと一緒に」作り上げたと考えると、かなりの量だと思います。もちろん、5万行すべてをAIが書いたわけですが、何を作るか、どう作るかを考え、仕様を決め、完成品を確認したのは人間です。

プロジェクト別コード規模

プロジェクト	行数	ファイル数	主な技術
コーポレートサイト	約8,000行	約60ファイル	Next.js, Tailwind
独自CRM	約20,000行	約150ファイル	Next.js, Supabase
AI記事生成	約15,000行	約100ファイル	Next.js, Claude API
日記アプリ	約5,000行	約40ファイル	Next.js, Supabase

---

【技術解説】型安全性とコード品質

TypeScriptを使用することで、型安全性を担保しています。

Supabase型の自動生成

データベーススキーマから型定義を自動生成しています：

# MCPを使用して型を自動生成
mcp__supabase__generate_typescript_types({ project_id: "xxx" })

生成される型の例：

export interface Database {
  public: {
    Tables: {
      users: {
        Row: {
          id: string;
          email: string;
          name: string | null;
          created_at: string;
        };
        Insert: {
          id?: string;
          email: string;
          name?: string | null;
          created_at?: string;
        };
        Update: {
          id?: string;
          email?: string;
          name?: string | null;
          created_at?: string;
        };
      };
    };
  };
}

この型定義により、データベースとの整合性がコンパイル時にチェックされます。

---

正直な感想

数字を並べてきましたが、正直な感想も書きます。

✅ 良かった点

• 開発スピードは確実に速くなった
• コストは大幅に抑えられた
• 「作りたいもの」をすぐ形にできる -型チェック・自動テストで品質が担保される

⚠️ 課題点

• AIも間違える(チェックは必要)
• 複雑な要件は伝えるのが難しい
• 学習コストはゼロではない -本番障害時は最終的に人間が判断する必要がある

万能ではありませんが、人間とAIが適切に役割分担すれば強力なチームになります。

---

まとめ：数字で見るAI開発

今日公開した数字をまとめます。

📊 開発したサービス：4つ ⏱️ 開発スピード：従来の3〜5倍 💰 月間コスト：3〜5万円 🐛 バグ修正時間：平均30分〜2時間 🧪 月間テスト回数：200回以上 📝 コード規模：5万行以上

技術的な品質保証

項目	数値・詳細
TypeScript型カバレッジ	100%(any使用禁止)
ESLintエラー	0件(マージ条件)
E2Eテストカバレッジ	主要フロー100%
Lighthouse Performance	90点以上(本番環境)
セキュリティ監査	毎PR実行

これが、非エンジニアの僕が「人間としての役割を担いながら」AIを活用して達成した実績です。構想・ディレクション・最終確認という人間の仕事と、実装・テスト・デプロイというAIの仕事。この役割分担があってこそ、これだけの成果を出せています。

今後も、透明性を大切にしながら開発を続けていきます。

---

てんちょー(合同会社QUEST 代表) 普段はSIerで経営企画部員として働きながら、週末起業で高校時代の友人と共同創業。何をやるかも大事だけど、誰とやるか(生きるか)を起点に多岐にわたるビジネスを展開。

🌐 コーポレートサイト：https://llc-quest.com 🐦 Twitter (X)：https://x.com/questceo_ai

#AI開発 #ClaudeCode #非エンジニア #開発効率 #品質保証 #DX