Project Story Every single week, we make dozens of financial decisions. While we use apps to track our budgets and savings, we rarely have visibility into how our spending impacts the planet. I realized there was a massive disconnect between our wallets and our carbon footprint, which inspired me to build EcoSpend: a sustainable finance tracker that bridges that exact gap.
What it does EcoSpend is a full-stack web application that allows users to log their daily purchases and instantly see the environmental impact of what they bought.
When a user enters an item (for example, a $12 fast-food burger in the "Food & Groceries" category), the app processes the transaction and assigns it a Carbon Score out of 10. But it doesn't just judge—our automated "environmental scientist" provides a practical, actionable suggestion for next time, like trying a plant-based alternative. All of this is saved to a purchase history table so users can track their trends over time.
How we built it I built EcoSpend using a modern, decoupled architecture:
Frontend: A responsive single-page application built with React and the newly released Tailwind CSS v4 for a clean, green, and intuitive user interface.
Backend: A custom Python FastAPI server that securely handles the business logic and API routing.
Database: A local SQLite database to persistently store user purchase histories.
AI Integration: The backend seamlessly queries the GreenPT AI model, which evaluates the specific purchase data to generate the carbon score and eco-friendly recommendations.
Challenges we ran into One of the main challenges was ensuring the communication between the React frontend and the FastAPI backend was secure and lightning-fast, especially when waiting for the AI model to return its analysis. Additionally, structuring the AI prompts so that GreenPT consistently returned structured data (a numerical score plus a concise text suggestion) required careful fine-tuning.
Accomplishments that we're proud of I'm incredibly proud of how seamless the user experience is. Getting the new Tailwind CSS v4 integrated made styling the frontend a breeze. Seeing the app successfully take a raw input like "Burger," correctly identify the high emissions of beef via AI, and render that score instantly on the screen was a huge win.
What we learned Building EcoSpend deepened my understanding of full-stack development, specifically bridging a React frontend with a Python backend. I also learned a lot about prompt engineering and how to integrate third-party AI models (GreenPT) into a live application to provide real-world value.
What's next for EcoSpend In the future, I plan to add data visualization (charts and graphs) so users can see their carbon footprint trends over months or years. I'd also love to integrate a receipt-scanning feature using OCR so users don't have to type their purchases manually!
Log in or sign up for Devpost to join the conversation.