BudgetWise: Spend Smart, Split Fair, Save… Well, Almost
An ultra-stylish glassmorphic expense app that does everything—except actually save your data!
🔍 The Problem
Group Expenses Get Messy
Splitting rent or dinner tabs shouldn’t feel like decoding hieroglyphics.Personal Budgets Lack Clarity
Juggling categories without real-time feedback leads to surprise overspends.Data Portability Is Rare
Most apps lock your data in a vault—then you can’t even get it out.
BudgetWise solves all these… but with one tiny catch:
It’s 100% frontend, so if you hit refresh, poof—your data vanishes into the ether. 😉
My backend skills are still “in progress,” so consider this a super-slick demo of what your expense app could be.
🚀 Key Features (Frontend-Only Edition)
1. Smart Group Splitting (“Let’s Split”)
Create Expense Groups—any number of participants
Add Expenses—description, amount, payer & split type
Instant Split Results—copy & paste for your group chat (just don’t hit refresh)
2. Personal Budget Tracking
Set a Monthly Limit—watch your bar fill up in real time
Add Personal Expenses—see “Spent vs. Remaining” instantly
Just Don’t Refresh—or, well… start over!
3. Rich Note-Taking
Create Notes with titles, content, and tags
Use them for bill reminders, grocery lists, or existential musings
Heads-up: These notes live in your browser only—so bookmark with care.
4. Data Management & “Portability”
Export All Data as JSON (because… front-end-only life!)
Import your own backups (yes, you can re-import that JSON)
Clear All Data with one click—refresh optional
Dashboard Stats show item counts & last-saved timestamp (until you close the tab)
🛠 Tech & Design Stack
React with glassmorphic CSS for that “futuristic window” vibe
LocalStorage + IndexedDB (our poor, overworked browsers)
Netlify hosting—because setting up a backend sounded like homework
Figma & Iconify for the prettiest prototypes on Earth
🎨 Design Philosophy
Clarity Over Clutter
Each screen has one mission: split or track.Trust Through Transparency
Real-time feedback—even if it disappears on reload.Aesthetic Delight
Micro-animations & subtle glass effects make money feel less math-y.
📈 What I Learned
Offline-First UX Matters—your data lives with you, not a server.
Data Portability Builds Trust—Export today, re-import tomorrow… if you remember.
Design Details Drive Engagement—even if backend support is MIA.
🔮 Next Steps
Real-Time Collaboration via WebSockets (when my backend levels up)
CSV/Excel Export for the truly data-obsessed
Dark Mode & Accessibility—so you can watch your budget at 2 AM
Mobile Apps (because refresh is too scary on small screens)
Try It Yourself
Explore BudgetWise (and test your memory) at budgetwisely.netlify.app—remember to back up before you close the tab!
Crafted with ❤️, React, and a dash of “I’ll add a backend someday” by Amish.