CoinTrack

Live: https://cointrack.ark07yad.workers.dev

A local-first expense tracker. Log what you earn, spend and save; see it by week, month, quarter and year; keep a running figure for what your investments are worth; and get plain, numeric suggestions about the parts that need attention.

Everything lives in the browser. There is no account, no server and no sync — the data is stored in IndexedDB with a localStorage mirror, and nothing is ever sent anywhere.

npm install && npm run dev

Then open http://localhost:5181. npm run build produces a static dist/, npm run lint runs oxlint, and npm test runs the suite.

On first run you can either set up a profile or load five months of generated sample data — the sample set is seeded, so it comes out the same every time, and it is deliberately imperfect (one overspent month, an uneven freelance income, a holding nobody has revalued) so the charts and the advisor have something real to say.

The screens

Home	This month at a glance: a spend dial against your budgets with a pace marker, in/out/saved with change against last month, the three most urgent suggestions, a 30-day spend trend, the category mix, budget bars and net worth.
Ledger	The daily log. A fourteen-day rhythm strip, one day's entries with running totals, and a searchable archive of everything grouped by date. Each entry has a title, an amount, a category, a date and an optional description. Recurring entries are offered here for confirmation, and their schedules are managed at the bottom.
Trends	The same four questions at four zoom levels — week, month, quarter, year — with a cash-flow chart, a running-total view against a paced budget, a stacked category-mix view, a breakdown donut, biggest movements against the previous period, a per-category table, a daily-spend heatmap and a side-by-side comparison table. A category filter narrows the whole page at once.
Invest	Savings goals and holdings. A goal is a target, optionally with a date, and progress comes from savings entries tagged to it — the figure that matters is what you would have to set aside per month from here, against what you have actually been putting aside. Below that: what each holding is worth and what you paid in, plotted separately so growth is distinguishable from deposits, with allocation, per-holding gain, stale-value warnings and a contribution history.
Advice	The suggestion box. Pick a section — the whole picture, spending, budgets, income, savings, investments, or a single category — and get rules applied to your own entries, plus a place to keep your own notes.
Settings	Profile, currency, budgets, and your data: export, restore, CSV import, sample data, erase.

How it is put together

React 19, Vite, Tailwind v4 and Recharts. No UI kit, no icon package, no state library — the icons are inline SVG, the motion is hand-rolled on requestAnimationFrame and the Web Animations API, and state is one object in a reducer behind a context.

src/
  lib/
    calc.js        dates, period ranges, bucketing, money formatting
    recurring.js   schedules for repeating entries
    goals.js       savings targets and what they require per month
    csv.js         bank-statement parsing, mapping and category guessing
    data.js        the three ledger kinds, categories, asset classes, currencies
    useFinance.js  every derived number, as pure functions plus thin hooks
    insights.js    the rule engine behind the advisor
    store.jsx      state, reducer, persistence, theme
    persist.js     IndexedDB + localStorage, with daily snapshots
    motion.js      count-up, stagger, FLIP list reflow
    demo.js        the seeded sample data
  components/      one file per screen, plus ui.jsx and EntrySheet.jsx

A few decisions worth knowing about:

Dates are strings, never Date objects. A day is 'YYYY-MM-DD' in local time. Storing an instant means an entry logged at 11pm moves to the next day when the machine changes timezone. Date is used only as a calculator, always constructed at local noon so a daylight-saving shift cannot roll a date backwards.

One period engine. Week, month, quarter and year all resolve through periodRange() and bucketsOf(), so a boundary day cannot be counted one way in the month view and another way in the quarter view. Quarter weeks are clipped to the quarter, so the bars always sum to the total.

Pace, not just totals. Every budget carries the share of the period that has elapsed. On the 6th, 60% of a budget spent is alarming; on the 26th it is fine, and a bar that cannot tell the difference is not worth drawing.

Contributions are kept separate from value. Without that column every deposit into an investment reads as growth. The dashed line on the net-worth chart is what you paid in; only the gap above it is a return.

Aggregation is pure. The advisor calls the same functions the charts do, outside React. If the two computed their own totals they would eventually disagree, and the app would be quietly lying somewhere.

Recurring entries are offered, never posted. A schedule works out what it owes and puts it in a queue; you confirm or skip each one. Auto-posting is less typing, but a ledger that invents transactions is one you cannot trust, and the only thing this app has going for it is that its numbers are ones you put there. Skipping advances the schedule exactly as posting does, so a subscription you cancelled stops asking.

This is the beginning of the README. Read the rest at the original. Read the full README ↗