Expense Tracker

Overview

The Expense Tracker application provides a comprehensive solution for tracking expenses, managing budgets, and categorizing expenses. It leverages the mentioned tech stack to deliver an efficient and user-friendly experience for managing personal finances

Getting Started

git clone <repo link>
cd keyboard_eccomrce

Frontend

cd front-end
npm install
npm run dev
frontend server will run at http://locahost:5173

Backend

open new terminal
cd back-end
npm install
npm run dev
backend server will run at http://locahost:1234

Tech Stack

Typescript
React
Reactquery
Node.js
Express.js
Prisma
Postgresql
Webpack

Features

User Authentication

• Register

  

  Users can create a new account by providing their necessary information, such as username, email, and password. The registration process securely stores their credentials for future login.

• Login

  

  Registered users can log into the application using their credentials. Upon successful authentication, they gain access to their personalized dashboard and can start managing their expenses, budgets, and categories.

DashBoard Page

• Line Chart And Card

  

  The Line Chart visually represents the user's expense data over time. It provides a graphical representation of how expenses have changed or fluctuated over a specific period. This helps users track their spending patterns and identify trends.

• Doughnut Chart

  

The Doughnut Chart provides a clear and concise breakdown of the user's expenses by category. It visualizes the proportion of expenses allocated to different categories using a circular chart with segments. This allows users to quickly understand their expense distribution and identify which categories consume the most of their budget.

• Most Recent Expenses

  

  Display the 10 most recent expense.

Expense Page

• View Expense

  

Users can easily view their expenses, budgets, and categories in a clear and organized manner.

• Search/Filter

  

  Users can quickly search for specific expenses, budgets, or categories by using search functionality.

• Add New Expense

  

Users can effortlessly add new expenses to keep track of their financial transactions.

• Update/Edit Expense

  

  Users can easily modify and update expense details, ensuring accurate records.

• Delete Existing Expense

  

Users have the ability to delete any unwanted or no longer relevant expenses.

Budget Page

• View Budget

  

  Users can see a list of their budgets.

• Search/Filter

  

  Users can search for specific budgets using keywords or filters.

• Budget Details

  

  View the full details of a budget.

• Add new budgets

  

  Users can create new budgets by providing the necessary details.

• Update/edit budget details

  

  Users can modify budget information such as name, amount

• Delete existing budgets

  

  Users can remove budgets they no longer need.

• View and remove budget expenses expenses

  

  Users can view or remove the expenses associated with each budget.

Category Page

• View Category

  

  Users can easily view their existing expense categories.

• Search/Filter

  

  Users can search for specific category using keywords or filters.

• Budget Details

  

  View the full details of a category.

• Add new category

  

  Users have the ability to create new expense categories to organize their expenses.

• Update/edit category details

  

  Users can modify and update category details, such as the name or description.

• Delete existing category

  

  Users can remove category they no longer need.

• View and remove category expenses expenses

  

  Users can view or remove the expenses associated with each category.

Responsive