Expense Tracker (Part 5/5): Frontend

Series links: Part 1/5 - Introduction Part 2/5 - Database Planning Part 3/5 - AWS Setup Part 4/5 - Backend APIs Part 5/5 - Frontend (you are here) What A small, fast web app that helps you add transactions with bills and later search/export them. Why Quick to use on phone or laptop. No heavy frameworks needed; it’s plain HTML/CSS/JS so you can host it anywhere. How Get the code Frontend source: https://github.com/sagarnayak/expense-tracking-public Pages you’ll see Login Add Entry: date, amount, Credit/Debit, category, description, and file uploads (camera or file picker) Listing: search by text or date range, open documents, export CSV Configure once Open your config and set the API endpoints to your domains: Upload: https://upload.your-domain.com Filter: https://filter.your-domain.com Category autocomplete: https://getcats.your-domain.com Description autocomplete: https://getdesc.your-domain.com Export CSV: https://exportcsv.your-domain.com Set a username and a password hash for login (bcrypt hash). This is just to protect the UI; the backend still validates requests. Using it Login with your username and password. Add a transaction. Attach bill photos or PDFs. You’ll see an upload progress bar. Go to the listing page. Filter by dates or keywords (like “groceries” or “uber”). ...

August 11, 2025 · 2 min · 275 words · Sagar Nayak