Expense Tracker Pro - React PWA Finance App

Expense Tracker Pro is a production-ready personal finance app built with the modern React stack. It runs entirely offline — no backend, no signup, no API keys. Every transaction stays on the user's device in IndexedDB. The whole thing ships as an installable Progressive Web App on desktop and mobile.

Buy it once, drop it on any static host, and either resell, rebrand, or ship it as part of a larger product.

Tech stack

React 18 · Vite 5 · Tailwind CSS 3 · Zustand · Dexie.js (IndexedDB) · Recharts · jsPDF · Framer Motion · lucide-react · React Router 6

Pure JavaScript — no TypeScript build complexity, so anyone comfortable with modern React can rebrand in an afternoon.

What you get in the download

• Clean, organized source (~40 files, ~3,000 LOC, fully linted)
• Pre-built dist/ ready to drop on any static host
• 4-part docs suite: Installation, Features, Customization, Deployment
• One-click vercel.json for instant Vercel deploys (with SPA-route fallback already configured)
• Commercial license with 30 days of email support
• Full third-party license manifest — every dependency is MIT / ISC / Apache-2.0 / BSD, zero copyleft, safe for commercial resale

Deploy in 3 minutes

The included vercel.json makes deployment one command:

npm install
npm run build
npx vercel --prod

The app also works perfectly from file:// for fully air-gapped use — no server required.

Live demo

https://01-expense-tracker-pro.vercel.app

What's NOT included

• No backend (intentional — this is an offline-first design)
• No user-account system (single-device by design; multi-device sync can be added by the buyer if desired)
• No live currency-rate API (rates are user-editable; integrate any free FX API in src/utils/currency.js if you need live conversion)

Support

Email support is included for 30 days from purchase. See LICENSE.md for the full commercial terms.

Features

• Income & expense tracking with 14 customizable categories (food, transport, bills, salary, freelance, gifts, investment, and more)
• Per-category monthly budgets with green / yellow / red progress bars and warning alerts
• Visual reports — donut chart by category, line chart over time, bar chart for monthly comparisons, date-range picker (this month, this year, last 30 days, all time, custom)
• PDF reports generated client-side via jsPDF — text-selectable, paginated, branded
• CSV export of any filtered transaction set
• Multi-currency — 15 currencies (USD, EUR, GBP, INR, JPY, CNY, AUD, CAD, CHF, SEK, NZD, MXN, SGD, BRL, ZAR) with editable conversion rates
• Full backup & restore — download/upload your entire database as a single JSON file
• Light & dark mode with automatic system-preference detection
• Fully responsive — sidebar on desktop, bottom nav on mobile, every screen rebuilt for touch
• PWA installable with offline caching via service worker (Workbox)

Requirements

• Node.js 18 or newer (20 LTS recommended) for local development
• npm 9+ (or pnpm / yarn)
• Any modern browser — Chrome, Edge, Firefox, Safari (last 2 versions)
• Any static web host for deployment — Netlify, Vercel, Cloudflare Pages, GitHub Pages, S3, cPanel — no Node.js server required at runtime
• Basic familiarity with React + npm if you want to customize beyond colors and copy

Instructions

Quick start (development)

cd 01-expense-tracker-pro
npm install
npm run dev

Open the URL Vite prints (typically http://localhost:5173).

Build for production

npm run build
npm run preview

The static site is generated in dist/ — drop it on any host.

Deploy to Vercel (1 command)

npx vercel --prod

The included vercel.json auto-configures Vite + SPA fallback. Works the same on Netlify (drag dist/ to app.netlify.com/drop), Cloudflare Pages, GitHub Pages, or any static host.

Customization

Full instructions in docs/CUSTOMIZATION.md inside the download — covers renaming the app, changing the accent color, swapping default categories, adding currencies, modifying the database schema, and more.

What buyers should know

• All data lives in the browser via IndexedDB — clearing site data wipes the user's transactions, so the Settings page includes JSON export/import for backups.
• PWA service worker registers automatically — the app works offline after the first load.
• Dark mode auto-detects OS preference; users can toggle in the header.
• Source is plain JavaScript (no TypeScript build complexity).