生成AI入門 2026.04.19
【2026年版】ウェブ開発AIツール比較|コード・デザイン・テスト用途別ガイド
用途別おすすめツール一覧(2026年版)
| 用途 | ツール | 月額 | 主な特徴 |
|---|---|---|---|
| コード補助 | Claude Code | $20 Pro | 大規模リファクタリング・CLAUDE.md設定 |
| コード補助 | GitHub Copilot | $10 | VS Code統合・自動補完 |
| コード補助 | Cursor | $20 Pro | IDEネイティブ・チャット補完 |
| AIコーディング | Windsurf | $15 | エージェント機能・ファイル一括編集 |
| デザイン生成 | Midjourney | $10〜 | 画像品質最高・プロンプト学習必要 |
| デザイン生成 | DALL-E 3 | GPT Plus内 | ChatGPT統合・日本語プロンプト対応 |
| テスト自動化 | Claude API | 従量課金 | カスタム自動化・Haiku$0.80/1M |
コード補助ツールの選び方フローチャート
既存のVS Code環境で始めたい?
YES → GitHub Copilot ($10/月)
NO ↓
大規模リファクタリングが中心?
YES → Claude Code Pro ($20/月)
NO ↓
IDEとAIを深く統合したい?
YES → Cursor Pro ($20/月)
NO ↓
自動化スクリプトを書きたい?
YES → Claude API直接利用 (Haiku $0.80/1M)
APIでテスト自動生成を実装する
# test_generator.py
# 既存のPythonコードからユニットテストを自動生成する
import anthropic
from pathlib import Path
client = anthropic.Anthropic()
TEST_SYSTEM = """あなたはPythonのシニアエンジニアです。
与えられたコードの完全なユニットテストをpytestで書いてください。
- 正常系・異常系・エッジケースを含める
- モックを適切に使う
- テスト関数に日本語docstringを付ける"""
def generate_tests(source_file: str) -> str:
"""ソースファイルのテストを自動生成する"""
source_code = Path(source_file).read_text()
response = client.messages.create(
model="claude-sonnet-4-5", # テスト品質はSonnet推奨
max_tokens=2000,
system=TEST_SYSTEM,
messages=[{
"role": "user",
"content": f"以下のコードのテストを作成してください:\n\n```python\n{source_code}\n```"
}]
)
inp = response.usage.input_tokens
out = response.usage.output_tokens
cost = (inp * 3.00 + out * 15.00) / 1_000_000
print(f"テスト生成コスト: ${cost:.4f} ({inp}+{out}トークン)")
return response.content[0].text
def batch_generate_tests(src_dir: str = "src/") -> dict:
"""ディレクトリ全体のテストをまとめて生成する(Batches APIで50%オフ)"""
import anthropic
batch_client = anthropic.Anthropic()
py_files = list(Path(src_dir).rglob("*.py"))
requests = []
for f in py_files:
code = f.read_text()
requests.append({
"custom_id": str(f),
"params": {
"model": "claude-haiku-4-5-20251001", # バッチはHaikuで安く
"max_tokens": 1500,
"system": TEST_SYSTEM,
"messages": [{"role": "user", "content": f"テストを生成:\n```python\n{code}\n```"}]
}
})
batch = batch_client.messages.batches.create(requests=requests)
print(f"{len(requests)}ファイルのバッチ処理開始: {batch.id}")
print("Haiku + Batches APIで通常比75%コスト削減")
return {"batch_id": batch.id, "files": len(requests)}
# 使用例
# 単一ファイルの場合
test_code = generate_tests("src/utils/calculator.py")
print(test_code)
# ディレクトリ全体(バッチ処理)
# result = batch_generate_tests("src/")
デザイン生成ツールの使い分け
# design_generator.py
# Claude APIでデザイン用のプロンプトを最適化してから画像生成AIに渡す
import anthropic
import openai # pip install openai
claude = anthropic.Anthropic()
oai = openai.OpenAI()
def optimize_design_prompt(rough_idea: str) -> str:
"""ラフなアイデアをMidjourney/DALL-E向けの最適プロンプトに変換する"""
response = claude.messages.create(
model="claude-haiku-4-5-20251001", # プロンプト最適化はHaikuで十分
max_tokens=200,
messages=[{
"role": "user",
"content": f"""以下のアイデアをDALL-E 3向けの英語プロンプトに変換してください。
スタイル・色・構図・雰囲気を含めた詳細なプロンプトにしてください。
アイデア: {rough_idea}
英語プロンプトのみ出力してください。"""
}]
)
return response.content[0].text.strip()
def generate_web_image(rough_idea: str) -> str:
"""アイデアをDALL-E 3で画像生成するまでのフル自動化"""
# Step 1: Claude Haikuでプロンプト最適化($0.80/1M)
prompt = optimize_design_prompt(rough_idea)
print(f"最適化プロンプト: {prompt[:100]}...")
# Step 2: DALL-E 3で画像生成($0.04/枚)
response = oai.images.generate(
model="dall-e-3",
prompt=prompt,
size="1024x1024",
quality="standard"
)
return response.data[0].url
# 使用例
# image_url = generate_web_image("ミニマルなテックスタートアップのヒーロー画像")
# 合計コスト: Haiku$0.0002 + DALL-E $0.04 = 約$0.04/枚(6円)