shisoworks
ポートフォリオ一覧に戻る

FutariKakeibo(フタリ家計簿)

夫婦・同棲カップル向けの共同家計管理PWAアプリ。立替精算・サブスク管理・支出分析をワンストップで。

React 19Vite 7TypeScriptTailwind CSS v4shadcn/uiSupabaseTanStack QueryZustandRechartsZod

プロダクト概要

FutariKakeibo(フタリ家計簿) は、夫婦・同棲カップル向けの共同家計管理アプリです。

共同口座への入金を起点に、家計支出の記録・集計・立替精算までをワンストップで管理。「誰がいくら立て替えて、いくら精算すべきか」を自動計算し、お金の見える化を実現します。

制作背景

共同口座を持っていても、日常の食費や日用品をプライベート資金で立て替えてしまうケースは多いです。月末になると「結局いくら立て替えたっけ?」となり、精算が曖昧になりがち。

この課題を解決するために、支出記録から月次精算までをシンプルなフローで完結できるアプリを開発しました。

主な機能

支出管理

  • 単件入力: フォームで1件ずつ記録
  • まとめ入力: テーブル形式で複数件を一括登録
  • 固定カテゴリ(家賃・水道代・ガス代・電気代)+ カスタムカテゴリ
  • 未精算期間の支出のみ編集・削除可能

月次精算

  • 締め日ベースで自動集計
  • メンバー別の立替額を自動計算
  • キャッシュバック(精算)の実行
  • 精算済み期間は自動ロック

ダッシュボード

  • 当月の入金ステータス(メンバー別)
  • 家計支出合計のリアルタイム表示
  • 共同口座の推定残高
  • 直近の支出リスト

支出分析(Recharts)

  • 月次推移グラフ
  • カテゴリ別内訳(円グラフ・棒グラフ)
  • メンバー別推移
  • 貯蓄推移グラフ

サブスクリプション管理

  • 家計 / 個人の分類
  • 月額・年額・不定期の課金サイクル対応
  • 家計サブスクは支出に自動合算

技術的なポイント

認証とアクセス制御

Google OAuth + Supabase Auth で認証。verify-access Edge Function でホワイトリスト照合を行い、許可されたユーザーのみアクセス可能。RLS(行レベルセキュリティ)でグループ単位のデータアクセスを制御しています。

Edge Functions による集計処理

ダッシュボード集計・精算プレビュー・精算実行・支出分析などの複雑なロジックは、Supabase Edge Functions(Deno)で処理。クライアント側の負荷を最小限に抑えています。

TanStack Query によるキャッシュ戦略

支出一覧やダッシュボードのデータ取得に TanStack Query v5 を使用。楽観的更新(Optimistic Update)により、支出登録時のUIレスポンスを高速化しています。

開発状況

  • MVP: 認証・支出管理・月次精算・ダッシュボード — 実装済み
  • 今後: レシートOCR・プッシュ通知・CSV/PDFエクスポートを計画中