Inspiration
As aspiring Hackathon masters who also have an interest in data and finance, we wanted to create a tool that helps individuals comprehend their financial data in an accessible way. On typical banking websites, purchases/transactions are usually represented by the date they occurred. While this is helpful for ensuring all your purchases have been recorded correctly, users could benefit from seeing where their money truly goes. To tackle this, we created a tool to help individuals categorize their expenses and see how much they're spending on rent, utilities, dining, etc. in a visual chart.
What it does
Users can export their CC or debit card activity into a csv, and then upload it to our site. The data will be processed and then users will be able to see their spending in a bar chart, organized by categories such as automotive expenses, entertainment expenses, etc. They can also input monthly expenses for rent, utilities, etc. The user can use this information to track their monthly expenses compare that with their earnings/debts in their bank accounts. It can help them with decision-making in regards to how much they might want to pay towards debt vs how much they would want to save.
How we built it
The project was built using React, Azure Cosmos, Chart.js, HTML, CSS, Typecript, and Javascript. We collaborated using Google Workspace, repl.it, and VS Code. We also deployed the website onto Microsoft Azure with the resource name Moneybean and stored the code on Github.
Challenges we ran into
We were ambitious with our project and it was our first time using many of the tools in our project such as Chart.js, React, and Cosmos DB. Our team was having issues with configuring Firebase and setting up the data model (in firebase, it's called structure). We thought Firebase would be similar to SQL concepts, but it doesn't mimic it and missed functionalities that were needed (i.e., sql table, stored procedure). We tried Azure Cosmos DB and it was similar enough to SQL that we were able to complete everything that was necessary. We also had trouble finding a tool that categorizes the transaction to a specific expense type.
Accomplishments that we're proud of
We are proud that we were were able to create a functional website in just two days. This hack incorporated pretty much all the categories in the competition and we all wanted to go all out on the last TechTogether Hackathon of the season.
What we learned
We broadened our knowledge in new technologies and tech fields, namely cryptocurrency and data. Since this was the first time creating a project with React and Azure Cosmos, we also learned how to create tools in a new tech stack. From this experience, we have an increased interest in further exploring the technology we've learned about and utilized.
What's next for MoneyBean
We can expand the features of the site and allow for more comparison with savings data. We could also incorporate chatbots to provide helpful tips on saving money.
Log in or sign up for Devpost to join the conversation.