Balance
Balance is a personal finance dashboard that turns raw transaction data into clear, actionable insights. Built with D3.js for custom visualizations and a Node.js backend for data aggregation.
Most budgeting apps either oversimplify (pie charts that tell you nothing new) or overwhelm (spreadsheets with 40 columns). There's a gap for people who want meaningful insight into their spending patterns without needing a finance degree to interpret the data.
A dashboard that automatically categorizes transactions and surfaces trends through purposeful visualizations. Instead of showing everything at once, it highlights what's changed -- unusual spending, recurring charges, and progress toward savings goals.
I built custom D3.js visualizations rather than using a charting library, because the interactions needed to be specific: brushable time ranges, drill-down by category, and animated transitions between views. The backend aggregates transactions from a mock banking API, categorizes them using rule-based matching with a fallback ML classifier, and exposes a REST API consumed by the React frontend. MongoDB stores transactions and user preferences, chosen for its flexible schema when dealing with varied transaction formats.
- 01Custom D3.js visualizations with brushable time ranges
- 02Automatic transaction categorization with manual override
- 03Monthly spending trend analysis with anomaly detection
- 04Savings goal tracker with projected completion dates
- 05Responsive design that adapts charts for mobile viewports
- 06Dark mode with accessible color palettes for all charts