DEV3 Free Expense and Budget Tracker — Source Code (React + Tailwind)

Source code of the DEV3 Expense and Budget Tracker, a private expense and budget tracker with monthly budgets, recurring entries, multi-currency totals from manual rates, SVG charts and CSV and JSON import and export.

Free download: sign in to any DEV3 account and click Download ZIP. Try it live: https://dev3.tech/tools/expense-budget-tracker shows the finished tool running.

What is in the download

• A standalone Vite + React + TypeScript + Tailwind CSS project: src/tool holds the tool, shared pieces sit beside it
• package.json with exact versions plus a lockfile, so npm ci works
• README.md (run, build, embed in Next.js or plain React) and an MIT LICENSE

What the code does

• Per-category monthly budgets with over-budget warnings
• Weekly, monthly and yearly recurring items created for whichever month you view
• Per-entry currency codes converted with manual rates into a base currency
• Category donut, budget bars and a six month income versus expense chart in flat SVG
• Bank-style CSV import (signed amounts supported) and a validated JSON backup

Tech stack

React 19, TypeScript, Vite, Tailwind CSS 4, jspdf.

Install and customise

The How to install and How to use tabs list the steps. In short: unzip, npm ci, npm run dev, then copy the tool folder into your own app if you want to embed it.

Good to know

• A browser-only tool: there is no backend or database in the code.
• Exchange rates are typed by hand; there is no live rate feed.
• Data is stored in localStorage, so it is per browser unless exported.