Building a Student Loan Payoff Calculator Without React: One Math Engine, Zero Database

The constraint that shaped everything

When I started building a student loan payoff calculator, I gave myself one rule: if a feature does not need a server, it does not get one. No user accounts, no API layer, no database. Loan inputs stay in the URL, results are computed in the browser, and the whole site is statically generated.

The result is LoanPayoff — a free suite of payoff calculators: avalanche vs snowball comparison, a multi-loan planner, and extra-payment modeling. No signup wall, no "create an account to see your numbers."

One math engine, many calculators

Every calculator calls the same small amortization module: given balances, rates and minimums, it produces the month-by-month schedule, total interest, and the debt-free date. The avalanche-vs-snowball view is just two runs of the same engine with different ordering rules — nothing duplicated.

The part I'm most happy with: the same engine runs at build time. The methodology page renders its worked example — a full amortization table and an SVG balance chart — from the identical functions the calculators use at runtime. The documentation literally cannot drift from the product, because it is the product's math, executed during astro build.

URL-state instead of a backend

Calculator state serializes into query params. That gives three things for free:

1. Shareable results — paste a link, the other person sees the same scenario
2. Zero storage compliance surface — nothing about a borrower's finances ever leaves their device
3. Free hosting — a static bundle on Cloudflare Pages costs nothing at this scale

Made to be borrowed

Student loan blogs explain payoff rules in prose; readers still can't map the rules to their own numbers. So the multi-loan comparison tool ships as an embeddable calculator — a one-line iframe any personal-finance writer can drop into a post. Sending free tools instead of asking for favors has been a surprisingly good outreach angle.

What I'd do differently

If I started today I'd still skip React for the math — plain functions are trivially testable and reused everywhere. The one thing I'd add sooner is the build-time report: rendering documentation from the runtime engine felt like a nicety, but it's what makes the site defensible as a YMYL source.

The calculators live at LoanPayoff.org. Feedback welcome, especially on edge cases — unusual grace periods and odd day-count conventions are where amortization code goes to die.