Full source · Original Work
Every dollar,
every transaction,
reconciled.
A complete personal-finance application — dashboard, multi-account balances, budgets, goals, emergency fund, investments and monthly/annual reports — built on React 19, TypeScript and Supabase. Clone it, brand it, ship it.
11
application modules
7
SQL migrations, ready to run
2
seeded demo accounts (IDR/USD)
0
backend servers to maintain
Walk the interface
click a module to switch the frame
Cash flow trend, expense breakdown and monthly KPIs at a glance.
Statement of features
Multi-account balances
Bank, e-wallet, cash and credit accounts tracked independently — transfers never inflate income or expense totals.
accounts.ts
Needs / wants budgeting
Per-category budget vs. actual with Safe / Near Limit / Over Budget status, copy-from-last-period in one click.
budgets.ts
Goals & emergency fund
Required-monthly-savings calculator against a deadline; emergency target auto-derived from live monthly spend.
goals.ts
Investment portfolio
Stocks, crypto, mutual funds, gold, P2P and real estate — capital, return and yield % per position.
investments.ts
Monthly & annual reports
Ratio analytics, 12-month trend charts, YoY comparisons, CSV export.
reports.ts
Row-Level Security
Every table isolated per user via Postgres RLS — no shared-tenant leakage, no custom auth server.
supabase/
Built on
React 19
TypeScript
Vite
Tailwind CSS v4
Supabase (Postgres + Auth + RLS)
TanStack Query
Recharts
Radix / shadcn
Live in three steps
full guide included in the download
01
Provision Supabase
New project on Supabase Cloud, run the 7 included SQL migrations in order, optionally load a seeded demo account.
02
Set two env vars
VITE_SUPABASE_URL and VITE_SUPABASE_ANON_KEY — copied straight from the Supabase dashboard.
03
Import to Vercel
Framework preset: Vite. Paste the two env vars. Deploy. Done.