Finance Tracker Web Application
Team Members ● Gautam Anantha Swamy ● Josh Cubero ● Ryan Hu ● Faith Kim ● Yangbo Liu ● Issac Zheng
Introduction This website will aid the user of this web app to manage one’s finances and keep track of spending habits by making available several tools to the user. The user of this website will be able to add several details like income, expenditure, savings, and investments and the user will be able to leverage the website in regulating his spending habits which will lead the user to make better financial decisions. The website goes about providing valuable insight to the user by depicting the habits of the user over a period of time by making use of graphical representation which the user will have access to. Though no solution is perfect, this website has the capability in aiding the user in making better financial decisions. If time permits, we will also be implementing a way for user to generate valuable reports i.e. overall financial summary for a user and what is the best course of action to take this instant and we are also considering implementing a way to alert the user if certain critical threshold levels have been breached depending on his portfolio.
Core Features
-
Dashboard Page : The main page user sees after logging in. Contains the summary details for the current month. This page has the summary details of his portfolio in the form of a graphical representation of a pie chart having details of the current month’s status towards the center. And this page is divided into 4 categories mentioned below.
-
Summary Section [Towards the left-hand side of the landing page] : The user can select the summary section on the left of the page which is available in 5 options, the options being [Income, Savings, Expenditure, Retirement and Investment]. After clicking either one of these options, The user will be able to see the summary details for the option selected. For Eg: The user will be able to access the saving habits [or Income, Expenditure, or Retirement] for a specific date range and a graphical representation will be available.
-
Add Transaction/Remove Transaction [On the right-hand side of the landing page]: The user will be able to add/remove an entry to his portfolio which can either be Income, Savings, Expenditure, or Retirement and this piece of data will be a part of his portfolio henceforth.
-
The last 5 recent transactions [Towards the right landing page below the Add/Remove Transaction Option]: Displays 5 recent transactions added by the user to the portfolio which can either be [Income, Savings, Expenditure, Retirement and Investment]
-
Current Status : This feature gives the current month’s status of the person's portfolio and displays whether the portfolio is in red or green status.
-
Account Creation : The website allows a user to create an account to access the website.
-
Admin Section : The Administrator section that can be used to manage the users of the system.
-
Image submission: While adding a transaction, there will be an option to upload one image(receipt for instance) with it.
Extra Features
-
Report Generation: If we manage to find extra time after completing the core features we are planning to implement the report generation section which is supposed to generate a report of the person’s portfolio for the selected date range and should give accurate suggestions on what the strengths and the weaknesses are at the moment.
-
Email Alert : The alert feature is supposed to send an email alert to the user if certain thresholds have been breached by the person’s portfolio. This feature is dependent on the threshold set by the user.
GitHub
https://github.com/FaithKimSheHer/Finance-Tracker-Web-Application
[[[ Steps to run the project in the local machine:]]]
Note : [Requirements : A mongo instance should be running in the local machine to run this project along with node being installed]
Step 1: Create a directory/folder in the local machine
Step 2: CD into that directory
Step 3 : Download the project zip file into your local machine and extract the contents of the zip file into that directory.
Step 4: Run the command to install the required node modules : npm install
Step 5: Use the seed file to create the collections for the application to make use of it: npm run seed
Step 6:Run the start command to start the server: npm start
Step 7: The user can use the website link provided and click itor copy paste the link http://localhost:3000/ into a browser of choice.
Step 8: Create a new user using the website or use one we have provided in the seed file listed below to log into the system [Email:[email protected] & Password:[email protected]]
From this point onwards the application can be tested and we have a recording/presentation uploaded which can be referred to as well.
Technologies used:
- bcryptjs (authentication)
- express-session (authentication, session management)
- expressjs (server/node framework)
- express-handlebars/handlebarsjs (handlebars templating view engine for express)
- chartjs (data visualization)
- mongodb (db)