Inspiration
Managing personal finances can feel overwhelming—especially for students, freelancers, and first-time earners. Many people don't realize how much they're spending on food delivery, subscriptions, or random online shopping until it’s too late. We wanted to build something simple yet powerful to help people make sense of their spending patterns and unlock smarter savings—automatically.
What it does
AutoSave AI is a smart personal finance assistant that helps users analyze their spending habits and unlock savings potential—instantly.
How we built it
Frontend: We used React + Tailwind CSS + Vite to build a clean, responsive, and friendly interface. Users can either upload a CSV or manually enter their transactions on the site. The interface immediately feels intuitive—just add a transaction, click analyze, and get savings tips.
Backend: The backend runs on FastAPI (Python). It parses the CSV data, runs custom logic to calculate:
total income and expenses
frequent spending categories
savings potential and surplus
Suggestions are generated dynamically based on thresholds (like if food > ₹1000, or if entertainment spend is too high).
Challenges we ran into
Designing Smart Suggestions We needed to ensure that suggestions were not just generic but context-aware. Building simple logic that feels intelligent required multiple iterations of rule tuning (e.g., food budget > ₹1000 triggers tips).
Frontend-Backend Communication Seamlessly sending a manually generated or uploaded .csv file to the FastAPI backend using FormData in the frontend was tricky, especially with CORS and file encoding issues.
UI/UX Polish Creating a user-friendly and visually appealing experience using React + Tailwind CSS—including dark mode themes, animations, and responsive design—took detailed CSS tweaking.
Accomplishments that we're proud of
End-to-End Personal Finance Agent We built a complete AI-powered personal savings assistant that can analyze financial transactions, generate actionable insights, and guide users toward better spending habits — all from a simple interface.
Smart Suggestions Engine We designed a rule-based recommendation engine that provides meaningful, real-life suggestions based on transaction patterns like high food or entertainment expenses.
What we learned
Full-Stack Integration We gained hands-on experience integrating React (frontend) with FastAPI (backend), managing file uploads, and handling cross-origin communication via CORS. UI/UX Matters Designing a simple yet effective UI taught us how important user experience and minimalism are in making technical tools approachable and useful.
What's next for AutoSave AI
Real-Time Bank Integration We plan to connect with banking APIs to automatically fetch transaction data, eliminating manual entry and CSV uploads entirely. Personalized AI Advice Integrate LLM-powered financial coaching to provide deeper, context-aware savings strategies based on user lifestyle and spending habits. Visual Insights & Trends Add advanced data visualizations and monthly trend tracking using Recharts or D3.js to help users understand patterns and optimize budgeting. Mobile App Build a mobile-first version of AutoSave AI to help users manage finances on the go, with push notifications for spending alerts and savings tips. Security & Data Privacy Implement user authentication and encryption to ensure data privacy and allow secure access across sessions.
Built With
- css
- fastapi
- html/css
- javascript
- pandas
- python
- react.js
- recharts
- tailwind
- vite
Log in or sign up for Devpost to join the conversation.