This project is my submission for Hacky New Year hackathon organised by MLH.
When it comes to managing money, we all have been at that stage of life where we have researched through various informative blogs, discussed with friends and family regarding the best use of money. Obviously, there are a lot of expenses that don’t seem to make much of a difference at a time but when all of it adds up to an amount, we surely are forced to think upon our needs and wants.
This brings us to new year resolutions and while brainstorming through ideas for the hackathon, one of the most fundamental problems that I faced came to my mind: Money management. Thus, the inspiration for this web app was to enable my new year resolution for this year (and hopefully for a lot of people), tracking personal expenses and using money wisely.
The application is designed to keep things simple while serving its purpose. Its feature include:
-
Adding and updating your budget
-
Tracking how much money you’ve spent till now and how much is still left
-
Adding and updating of expenses as a list
-
Icing on the cake: quotes about money to keep you motivated towards saving :)
Primarily, the application is built with the help of React library. Bootstrap has been used to provide styles to the website while Postman has been used as a tool to analyze the API. Finally, the “API Ninjas” API has been used to fetch quotes.
The very first challenge that I faced during developing the website was to maintain the context of the website. In simple words, I had to keep updating the balance left for the user when new expenses were being added. The use cases took me some time to think upon until I finally concluded all into a list. Next, the integration of quotes API was quite challenging and it took me a while to configure it so that quotes could be fetched.
The biggest achievement was to complete the website demo well in time. It took quite a planning to finish what I had visualised for the website to look like, both functionality wise and UI wise.
I learnt the following things this weekend:
- Maintaining multiple React components that depend on each other
- Dispatching actions in React Context
- Hosting a website on Netlify and configuring environment variables
The following functionalities are in plan to be added:
- Adding multiple profile views to manage multiple budgets for different uses (eg. work budget, home budget etc.)
- Personalised recommendations for cutting off unwanted expenses by analyzing expenditures.
- "Tips" dialog box for daily expense management tips.