Budget Tracker WebApp

React.js
Pakistan
November 17, 2023 10:19 PM

Budget Tracker webapp is React.js and Firebase that helpful for Tracking the income,Expenses,and Savings.

Front-End

Back-end

  • Firebase is used for the backend of the project.

Features

  1. User can Track All Year Income,Expenses, and Savings.
  2. User can Add Income.
  3. User can add Expenses if the income of those month is available.
  4. User can add Savings if the income - Expenses amount is matched with user input if those amount is available for this month then add savings.
  5. User cann't delete the Income if the Expenses, and Savings are present of those months.

Login Page

After Login Dashboard is show in which Total Income, Total Expenses, Total Savings show on the top Cards then you can Filter the data year wise by select the year.

Dashboard

User can Enter the Income Name, Type, Amount and Date, after that click on the Submit button the Income is Add Successfully Toast will be show on the left side.

Income

User can Enter the Expenses Name, Type, Amount and Date, after that click on the Submit button the Income is Add Successfully Toast will be show on the left side. 1 - User can only Add the Expenses if the expenses is available of this month and year other wise they show error.

Expenses

User can Logout by click on the Logout button on top header. Logout

Deployed