As a solo indie developer, I hate heavy backend architectures for simple tools.
When I decided to build a financial calculator, I had two goals: it had to be 100% private for the user, and it had to load instantly.
Here is how I built the Lihayo Loan Calculator using pure HTML, CSS, JavaScript, and AI.
1. The Math (Amortization Formula)
The core of any loan calculator is the amortization formula:
M = P * r * (1 + r)^n / ((1 + r)^n - 1)
Instead of relying on a server to run this math, all calculations happen directly in the user's browser. This means zero data is sent over the network.
2. Visualizing the Data with Chart.js
Numbers are boring. I wanted users to see how much of their money goes to principal vs. interest. I used Chart.js to create a dynamic doughnut chart that updates in real-time as the user types. It makes the financial reality much clearer.
3. Generating the Amortization Schedule
I used a simple JavaScript loop to generate a full month-by-month breakdown of the loan, including payment date, principal portion, interest portion, and remaining balance. No backend required.
4. Using AI for Speed
I used AI (like DeepSeek) to generate the CSS framework and debug edge cases (like handling leap years in the date calculations). It cut my development time in half.
The Result
You can try the tool here. It's completely free, ad-free, and runs entirely in your browser.
👉 https://app.lihayo.com/loan/
I also built a fully functional <iframe> embed version for other bloggers to use. Let me know what you think of the UI!
Top comments (0)