Expense Tracker Pro - React PWA Finance AppExpense Tracker Pro - React PWA Finance App
Offline-first personal finance tracker built with React 18, Vite, and Tailwind. PWA-installable, no backend, no signup.Expense Tracker Pro - React PWA Finance App
Offline-first personal finance tracker built with React 18, Vite, and Tailwind. PWA-installable, ...
Overview
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.jsonfor 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.jsif 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).
Other items by this author
| Category | Scripts & Code / ReactJS |
| First release | 11 May 2026 |
| Last update | 11 May 2026 |
| Files included | .css, .html, Javascript .js |
| Tags | dashboard, budget, finance, offline, PWA, expense tracker, react, dark mode, indexeddb, tailwind, vite, csv export, multi-currency, recharts, jspdf |








