Skip to content

irfad-c/spending-tracker

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

72 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

💰 Spending Tracker Web App (MERN)

A full-stack MERN (MongoDB, Express, React, Node.js) application that helps users track their personal expenses and income. It provides a clear summary of total balance, total income, and total expenses, along with a detailed transaction history.

🚀 Features

  • View financial summary – Total balance, total income, and total expenses at a glance.
  • Category-based tracking – Separate lists for income and expenses.
  • Complete transaction history – Easily view, add, or delete any transaction.
  • Manage categories – Add or delete income and expense categories.
  • Secure user authentication – Implemented with JWT and password hashing.
  • Cloud database – Uses MongoDB Atlas for secure data storage.
  • Responsive design – Optimized for both desktop and mobile devices.

🛠️ Tech Stack

Frontend: JSX,React,Context API,CSS (Responsive Design)

Backend: Node.js, Express.js , Mongoose

Database: MongoDB Atlas (NoSQL Cloud Database)

Authentication: JSON Web Token (JWT), bcrypt.js (Password Hashing)

Version Control: Git & GitHub

Development Tools: Visual Studio Code, Postman, Nodemon

💻 Screenshots

🔐 Login Page

Login

🏠 Dashboard

Home

💰 Transactions

Transactions

📊 Categories

Categories

⚙️ Installation and Setup

1️⃣ Clone the repository

git clone https://github.com/irfad-c/spending-tracker.git

cd spending-tracker

2️⃣ Install dependencies

For server:

cd server

npm install

For frontend:

cd client

npm install

3️⃣ Set up environment variables

Create a .env file inside the backend folder and add:

PORT=5000

MONGO_URI=your_mongodb_connection_string

JWT_SECRET=type_secret_key_here

Note:

The backend is hosted online, so you don’t need to run it locally.

If you want to run both locally, they can set PORT=5000 in their own .env file and update the frontend BASE_URL to http://localhost:5000.

4️⃣ Run the app

Start backend:

npm run server

Start frontend:

npm start

📬 Contact

If you have suggestions or feedback, feel free to reach out:

📧 irfadc500@email.com

About

A MERN stack web app that lets users securely track income and expenses with authentication, authorization, and real-time balance update

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

 
 
 

Contributors