こんにちは！
以前から「市販の家計簿アプリは機能が多すぎる」「逆に少なすぎて使いにくい」という悩みがありました。そこで今回、ClaudeCodeを使って自分専用の家計簿Webシステムを一から作ってみました！その試行錯誤の記録をまとめます。
🏦 システム概要：OpenHAB とは？
今回作ったシステムの名前は OpenHAB（Open Household Account Book）。家族みんなで使える家計簿Webアプリです。
- PHPで実装したWebアプリケーション（サーバー：CORESERVER CoreX）
- 家族全員がスマホやPCからアクセス可能
- LINEと連携して、スマホだけで操作できる
- AIを活用した支出分析・アドバイス機能付き
コード量はPHPファイルだけで約6,500行、19ファイルという規模になりました。
🛠️ 主な機能（10機能）
① 収支管理
収入・支出の基本的な登録・編集・削除。カテゴリ分けして一覧表示できます。
② 予算管理・アラート
カテゴリごとに月次の予算を設定。予算超過が近づくと通知を受け取れます。
③ 定期支出の自動登録
家賃や通信費など毎月固定の支出をcronジョブで自動入力。手動登録の手間がゼロに。
④ 立替管理
家族間の立替を記録して精算。誰がいくら立て替えているかが一目でわかります。
⑤ LINEレシートOCR（←ここが一番のポイント！）
LINEにレシートの写真を送るだけで、AIが自動読み取りして支出を登録してくれます。詳しくは後述します。
⑥ リマインダー通知
1回限り・毎週・毎月のリマインダーをLINEで受け取れます。支払い忘れ防止に活躍。
⑦ グラフ・レポート分析
Chart.jsを使った月次・カテゴリ別グラフで支出傾向を可視化。
⑧ 家族アカウント管理・権限制御
オーナーは全員の収支を閲覧、メンバーは自分の分のみ表示など、細かな権限設定が可能。
⑨ AIアドバイス・月次予測
Claude AIが支出傾向から月末予測と節約アドバイスを自動生成。毎日配信されます。
⑩ セキュリティ機能
2段階認証（TOTP）、レート制限（3回失敗で30分ブロック）、日本国内IPのみアクセス許可（ip-api.comで国判定）など、セキュリティもしっかり実装しました。
💻 技術スタック
| 区分 | 技術 |
|---|---|
| バックエンド | PHP 7.4+、MySQL/MariaDB、PDO |
| フロントエンド | Chart.js 4.4.0、Vanilla JS、CSS |
| 外部API | Anthropic Claude（Opus/Sonnet/Haiku）、LINE Messaging API |
| インフラ | CORESERVER CoreX（LiteSpeed Webサーバー） |
😅 苦労した点・試行錯誤
問題①：OCR処理のタイムアウト
最初はLINEからレシート画像を受け取ったタイミングで、そのままClaude Vision APIを呼んでOCR処理をしようとしました。しかしLINEのWebhookは応答タイムアウトが短いうえ、共有サーバー（LiteSpeed）での長時間処理には制限があります。
解決策：非同期キューシステムの導入
- Webhookは受け取ったらすぐ
ocr_queueテーブルにキューイング - cronジョブ（
process_ocr_queue.php）が定期的にキューを処理 - OCR完了後、LINEプッシュで「登録完了」を通知
キューテーブルの構造はシンプルです：
CREATE TABLE ocr_queue (
id INT AUTO_INCREMENT PRIMARY KEY,
user_id INT NOT NULL,
line_user_id VARCHAR(100) NOT NULL,
image_url TEXT NOT NULL,
status ENUM('pending','processing','done','error') DEFAULT 'pending',
result_json TEXT,
created_at DATETIME DEFAULT CURRENT_TIMESTAMP,
processed_at DATETIME
);Webhookは画像URLをキューに積むだけで即座にレスポンスを返します：
// line_webhook.php - 画像メッセージ受信時
if ($message['type'] === 'image') {
$imageUrl = "https://api-data.line.me/v2/bot/message/{$message['id']}/content";
$stmt = $pdo->prepare(
"INSERT INTO ocr_queue (user_id, line_user_id, image_url) VALUES (?, ?, ?)"
);
$stmt->execute([$userId, $lineUserId, $imageUrl]);
// すぐに200 OKを返す（タイムアウト回避）
http_response_code(200);
exit;
}この非同期設計でタイムアウト問題を完全に解消できました。
問題②：Claudeモデルの使い分け
コストとパフォーマンスのバランスを取るため、用途によってモデルを使い分けています：
- Claude Opus：月次財務予測・予算計画（精度優先）
- Claude Sonnet：LINEレシートOCR（速度と精度のバランス）
- Claude Haiku：毎日の節約アドバイス（コスト優先）
📸 LINEのOCR機能の詳細
この機能が一番気に入っています。仕組みはこうです：
- LINEでレシートの写真を送信
line_webhook.phpがHMAC-SHA256で署名を検証してリクエストを受け付け- 画像URLと情報を
ocr_queueテーブルに保存（即レスポンス返却） - cronが定期実行され
process_ocr_queue.phpがキュー処理を開始 - Claude Vision APIに画像を送り、金額・店舗名・カテゴリ・日付を自動抽出
- 支出トランザクションとして自動登録
- LINEプッシュ通知で「〇〇円（〇〇）を登録しました」と通知
cronで実行される処理のコアはこんな感じです：
// process_ocr_queue.php - Claude Vision APIでOCR処理
$response = $client->messages()->create([
'model' => 'claude-sonnet-4-5',
'max_tokens' => 512,
'messages' => [[
'role' => 'user',
'content' => [
['type' => 'image', 'source' => [
'type' => 'base64',
'media_type' => 'image/jpeg',
'data' => base64_encode($imageData),
]],
['type' => 'text', 'text' =>
'レシートから以下をJSON形式で抽出してください：' .
'{"amount": 金額(数値), "vendor": "店舗名", "category": "カテゴリ", "date": "YYYY-MM-DD"}'
],
],
]],
]);
$ocr = json_decode($response->content[0]->text, true);レシートをパシャっと送るだけで支出が記録される体験は、想像以上に便利でした。財布からレシートを出してアプリを開いて…という手間が完全になくなります。
🤖 ClaudeCodeで作った感想
今回のシステムはほぼすべてClaudeCodeとの対話で実装しました。特に良かった点：
- セキュリティを自動的に考慮してくれる：CSRFトークン、セッション管理、SQLインジェクション対策など、指示しなくても実装してくれた
- 既存コードとの整合性を保ってくれる：ファイルを読んでから「この設計に合わせて実装する」という動き方をしてくれる
- エラーを自分で発見して修正する：実装後に「あ、これだとXXの場合に問題が起きる」と自分で気づいて直してくれることが多かった
一方で課題も感じました。大規模なシステムになると、前の会話の文脈を忘れてしまうことがあり、その都度「前回こう実装したから今回はこうして」と補足が必要でした。
✅ まとめ
ClaudeCodeを使って、ゼロから本格的な家計簿Webシステムを構築することができました。市販アプリでは実現できない「自分家族専用の仕様」「LINEで完結するUI」「AIによる自動分析」を1つのシステムに詰め込めたのは、自作ならではの強みです。
今後は以下の機能追加も検討中です：
- 銀行明細の自動取込
- 音声入力での支出登録
- 家族間チャット機能
コードはまだ非公開ですが、ご興味のある方はお問い合わせください！
