Kakeibo

出発点は、「今日は記録しなくていいか」となりがちな家計簿を、日常で続けられるものにすることでした。支出や収入を残すための項目を絞り、あとから必要になる情報も無理なく足せる形を目指しています。

記録して終わりではなく、月ごとの収支、分類ごとの内訳、予算やこれからの支払いまで同じ場所で確認できるようにしました。家計を細かく管理するためというより、日々のお金の流れをつかむための道具です。

開発は2026年8月に始まりました。入力のしやすさを土台に、実際の家計管理で必要になる確認・計画・データ管理へと段階的に広げています。

1. 2026.08

   記録と振り返りの土台を作る

   収入・支出の登録、履歴、分析を備えたPWAとして開始。ReactとTypeScriptで画面を作り、認証とユーザー別保存を前提にした構成を整えました。

2. 2026.08

   日常の家計管理へ広げる

   メール／パスワードとGoogleによる認証、月予算、定期取引、クレジットカードの管理、CSV取込・書き出し、JSONバックアップを追加しました。

3. 2026.08

   データを安全に扱えるようにする

   重複登録やCSV取込の防止、履歴を守る非表示化、ページング、原子的な並び替えを実装。WorkerとD1のCRUD・整合性を確認する回帰テストも加えました。

4. 2026.08–

   使い方を伝える画面も整える

   アプリ内の紹介、利用規約、プライバシーポリシーを静的な公開ページとして追加。小さなアニメーションも加え、操作結果が分かりやすい画面へ調整を続けています。

機能を増やすだけでなく、入力を妨げないこと、履歴を失わせないこと、データを安全に扱うことを、同じ優先度で見ています。

記録では、支出か収入かを選び、分類、支払い方法、金額へと順番に進みます。入力に失敗しても内容を保持し、同じ送信を重ねて登録しないようにしているため、記録をやり直す負担を減らせます。

確認したい数字は、月・年・全期間や日付・分類・支払い方法などで絞り込めます。金額の一覧だけでなく、収支、分類別の横棒、時系列推移を通じて、使い方の傾向を読み取れるようにしています。

テーマの切り替えやPWAとしてのインストールにも対応しています。機能ごとに画面を増やしすぎず、記録・分析・管理を行き来しやすい構成を保つことを大切にしています。

Frontend

Vite、React、TypeScriptで構成。チャートライブラリに頼らず、軽量なSVGとCSSで分析の表示を作っています。

Authentication

Firebase Authenticationを使用。メール／パスワードとGoogleログインに対応し、クライアントはFirebase ID TokenでAPIへアクセスします。

API & data

Cloudflare Workerがトークンを検証してから処理し、Cloudflare D1にユーザー別のデータを保存します。クライアントからD1へ直接接続しない構成です。

PWA & hosting

Web App ManifestとService Workerを備えたPWAです。静的アセットだけをキャッシュし、認証情報・API・家計簿データはキャッシュしません。画面はCloudflare Pages、APIはCloudflare Workerで公開しています。

• 短い収支入力分類・支払い方法・金額から始め、日付、支払先・入金元、メモを必要に応じて残せます。
• 分析と月予算支出・収入・収支、分類別の内訳、時系列推移を確認し、月全体の予算と残額も見渡せます。
• 履歴の編集と検索記録を編集・削除し、日付、分類、支払い方法、金額範囲で必要な履歴を探せます。
• 分類・支払い方法の管理使い方に合わせて追加・編集・並び替えが可能です。使用済みの項目は履歴を守るため非表示にできます。
• 定期取引とカード管理毎月・毎年の予定を管理し、確認してから実績へ確定できます。カードの締め期間、利用可能枠、次回引落予定も扱えます。
• バックアップと取込ページングで完全に取得するJSONバックアップ、CSVの書き出し、検証済みの追加取込に対応しています。

すべてのAPIでFirebase ID Tokenを検証し、データ操作のSQLにはユーザーIDを必ず含めています。入力値はWorker側でも確認し、SQLはprepared statementで扱います。

• 再送や連打による同じ記録の二重登録を、クライアント送信IDで抑止
• 履歴がある分類・支払い方法・定期取引は、安易に物理削除せずデータを保持
• JSON APIに Cache-Control: no-store を付け、ユーザー固有のデータをPWAキャッシュへ入れない
• アカウント削除では再認証を求め、家計簿データと認証アカウントを削除

次は、本番の認証・保存を通したE2Eテストを進めながら、オフライン入力と復帰時の同期を検討しています。分類別の予算、よく使う入力の組み合わせ、レシート画像、カード請求の状態管理も、日々の記録をより自然にする候補です。