© 2024 IJNRD | Volume 9, Issue 5 May 2024| ISSN: 2456-4184 | IJNRD.

ORG

Personal Expense Tracker

Shubhangi Bhardwaj (2000300130127), Sneha Gupta (2000300130130),
Unnati Jaiswal (2000300130139), Riya Bhargava (2000300130103)
Department of Information Technology
Inderprastha Engineering College,
Ghaziabad, India

Summary- The Personal Expense Tracker project is Personal Expense Tracker," a user-friendly tool that
a robust Full Stack web application developed with replaces traditional methods, allowing for quick and
the MERN stack. It tackles the challenges easy record-keeping with just a few clicks.
individuals face in managing personal finances by
offering an intuitive and user-friendly platform for 1.2 BACKGROUND AND PURPOSE OF
tracking income, expenses, and investments in real-
THE PROJECT
time.

Equipped with features like automated transaction Financial challenges are a prevalent issue among
categorization, customizable budgeting tools, the students, particularly with the soaring costs of energy,
Personal Expense Tracker project enables users to daily necessities, and food.Many students resort to
effectively manage their finances. Utilizing part-time jobs unrelated to their studies, balancing
advanced technology, the project caters to actionable work and academic responsibilities while striving to
insights and personalized recommendations, helping maintain good grades. This scenario underscores the
users in accomplishing their financial goals. critical need for effective budget management skills.

Though today’s banking applications often feature

1. INTRODUCTION budget management tools, allowing users to
categorize and track their monthly credit card
1.1 Background expenditures on food, utilities, entertainment, and
travel. These insights enable users to adjust their
Throughout our entire life, acquiring materials and spending habits and stay within their budgets and
belongings is a never ending need. To meet our needs achieve their financial goals. Inspired by this concept,
and desires, we purchase goods, and this requires our project aims to develop a comprehensive MERN
money. Thus, the cycle of earning and spending is a stack based project tailored for students.
continual process. Traditionally, people have used The primary goal of this project is to create an
paper-based methods to track income and expenses, application using the MERN stack (MongoDB,
but this approach is cumbersome, tedious and time- Express, React, and Node.js) that helps students or
consuming. The probability of papers getting anyone in general in scrutinizing their spending habits
misplaced is also an issue in this regard. and help users make more informed financial
decisions.
To simplify and facilitate this process, a management
system is important for efficiently managing day-to- Our project ponders upon several pivotal research
day earnings and expenses. Our solution is the " questions:

IJNRD2405499 International Journal of Novel Research and Development (www.ijnrd.org) e927

c927
 © 2024 IJNRD | Volume 9, Issue 5 May 2024| ISSN: 2456-4184 | IJNRD.ORG
created, they can log in to proceed to the home page. If
How can the MERN stack be harnessed to develop an not, they are required to create an account on the register
efficient and user-friendly expense tracking page. After signing up, they will be redirected to the
application ? login page, the user will have to enter the user
What essential features should be incorporated to credentials they just created. Landing at the home page
make the application both user-friendly and highly after successfully logged in, they can navigate back and
efficient? forth between there and the categories. Users can log out
By leveraging cutting-edge technology, this project as well and will have to login again in case user wants
aims to help the users make well informed decisions to use the application again. Only home and category
regarding their expenses and finances by providing page can be accessed if the user is logged in. While the
sign in and register page can be visited by anyone.
them with a platform wherein they can login and keep
a track of their expenses securely instead of jotting
down somewhere. We also have future scope set for 3.2 Project Structure
our project which is the amalgamation of the bank
details and transaction details which also includes We have frontend and backend folders wherein the
loan instalments, bills etc. can be done for a far better respective logics for both frontend and back end is
user experience. seated. We have public and src subfolders as well.

In the frontend folder we have, index.html, all the css

files and js files, components files
2. PROBLEM DESCRIPTION
like,LineProgressBar.js, Header.js, and many more.
All our assets also reside here in frontend folder.
1. User-Friendly Expense Tracking:
Develop a web application that allows users to easily In the backend folder we have, controllers, routers,
and efficiently track their daily expenses. The models and database files.
application should enable users to add, edit, and  The “components” folder contains all the
categorize expenses with a click. modular and reusable components that are used
2. Real-Time Expense: on a page, such as forms, lists, charts, and the
Build an expense tracker that reflects real-time navigation bar
expenses to users so that user can keep track and alter  The calculations in this project are happening in
their spending habits. the back-end server, specifically in the
3. Expense Analytics and informative Insights: addTransactionController function, which is
Develop a web application that not only tracks responsible for handling the addition of new
expenses but also provides users with insightful transactions to the database.
analysis using graphical representations to help users  The “utils” folder holds our redirection
understand their spending patterns over time. components which redirect user to destinations
based on their authorization status.
3. APPROACH AND IMPLEMENT While in the “server” folder, there are also multiple
subdirectories that worth mentioning:
The application was finished in four month and a half,  The “config” : Defines the configuration
which includes the time for designing, planning, reading variables for the application, such as the database
the documents, coding, debugging and deployment. The connection string and the secret key for the JSON
design and planning phase reflected how the final Web Tokens (JWTs.
product would look like, the kind of components to be  The “controller” folder includes all the functions
used on a page. The front-end and the back-end were in the server that tie to our routes.
being developed sincerely to make sure they are working  The “database” folder is where we connect to our
together efficiently with each other. Various MongoDB database.
documentations are of great help in the development of  The routes/transaction.js: Defines the
the application. The writing phase for the review paper
transaction-related routes, such as the add,
also started as soon as the project culminated.
update, and delete routes.
 models/User.js: Defines the User schema and
3.1 Application Workflow model for the MongoDB database.
 models/Transaction.js: Defines the Transaction
Figure 1 shows the workflow of our application. Users schema and model for the MongoDB database.
start at the login page. If an account has already been

IJNRD2405499 International Journal of Novel Research and Development (www.ijnrd.org) e928

c928
 © 2024 IJNRD | Volume 9, Issue 5 May 2024| ISSN: 2456-4184 | IJNRD.ORG

FIG-1

4 Conclusion
References
The review paper is a vital part in the learning path in
order to become a full stack web developer. The [i] Review Paper Phat Tran, "Final Thesis," [Online].
application has also proved to be of great help in daily Available:
life as it has given an informative perspective on day- https://www.theseus.fi/bitstream/handle/10024/8024
to-day and monthly expenses, which motivates the 83/Final_Thesis_PhatTran.pdf?sequence=2.
author to alter the spending habit and accomplish the
targeted finance objectives. The MERN stack [ii]Udemy Expense Tracker Management System
provides a seamless connection between the front-end Course - https://www.udemy.com/course/mern-stack-
and the back-end, provides various methods like expense-tracker-application/
taking data and authentication. The Node server with
Express framework, along with the MongoDB,
handles requests quickly and stores a huge amount of [iii] After Academy. (n.d.). Mastering Mongoose for
data without any interruptions. The login and register MongoDB and Node.js.
function also provides a safe and secure experience https://afteracademy.com/blog/mastering-mongoose-
for the user because the important data such as the for-mongodb-and-nodejs/.
transaction list can only be accessed by the user.
However, certain improvements can be made in this [iv]Material UI. Material UI Documentation.
application in the future to make the user experience https://mui.com/material-ui/react-button/
more interesting and convenient. For example, The
amalgamation of the bank details and transaction [v] Mongoose.(n.d.).Mongoose
details which also includes loan instalments, bills etc. Documentation .https://mongoosejs.com/
can be done for a far better user experience. To make
the application user friendly for other strata of people [vi] Wikipedia, npm. (n.d.). npm (software).
in the society, languages can be added in the https://en.wikipedia.org/wiki/Npm_(software).
application like Hindi, etc. Furthermore, addition of
blockchain will help in boosting security of the
application.

IJNRD2405499 International Journal of Novel Research and Development (www.ijnrd.org) e929

c929