Skip to content

Aadarsh-max/Expense-Tracker

Repository files navigation

Expense Tracker – MERN Stack Interactive Finance Dashboard

An intuitive full-stack Expense Tracker web application built using the MERN stack (MongoDB, Express, React, Node.js). This app allows users to manage their finances effectively, with smart visualization, real-time updates, and downloadable reports.

Live Demo: https://expense-tracker-gamma-dun.vercel.app

Overview

Modern finance management application with interactive dashboard, real-time transaction tracking, visual analytics, and data export capabilities. Users can add income and expenses, categorize transactions, view spending trends, and download financial reports.

Key Features

Dashboard

  • Display total balance, income, and expenses summary
  • Pie, bar, and line charts showing spending trends
  • Real-time financial overview

Add Transactions

  • Add income and expenses using responsive forms
  • Emoji picker for intuitive categorization
  • Transaction type and amount input
  • Date tracking for all transactions

Download Data

  • Export financial data as Excel sheets
  • One-click download functionality
  • Formatted reports with categories

Real-Time Updates

  • Instant chart and summary updates
  • Smart categorization by transaction type
  • Live balance calculations

Tech Stack

Frontend: React, Tailwind CSS Backend: Node.js, Express.js Database: MongoDB with Mongoose Data Visualization: Chart.js / Recharts File Export: xlsx (Excel file generation) Deployment: Vercel (Frontend), Render (Backend), MongoDB Atlas (Database)

Installation & Setup

git clone https://github.com/yourusername/expense-tracker-frontend.git
cd expense-tracker-frontend

npm install

# Create .env file
VITE_API_URL=http://localhost:5000

npm run dev

How It Works

  1. User logs in to dashboard
  2. Views financial summary (total balance, income, expenses)
  3. Sees visual representation with charts
  4. Adds new transactions with category and amount
  5. Charts update in real-time
  6. Downloads financial reports as Excel file

Features Explained

Dashboard Visualization

  • Total balance at a glance
  • Income vs expense comparison
  • Spending breakdown by category
  • Multiple chart types for analysis

Transaction Management

  • Add income or expense entries
  • Assign emoji categories
  • Track transaction dates
  • View transaction history

Data Export

  • Generate Excel reports
  • Include all transactions
  • Download with formatted layout
  • Useful for record keeping

Browser Support

Chrome, Firefox, Safari, Edge (Latest versions)

Deployment

Frontend deployed on Vercel with automatic deployments from main branch.

Future Enhancements

  • Recurring transactions
  • Budget limits and alerts
  • Multi-user support
  • Monthly reports
  • Category customization
  • Dark mode theme
  • Mobile app

Manage your finances efficiently with visual insights and easy tracking.

About

Expense Tracker is a smart and intuitive MERN stack application that helps users manage their finances with ease. Users can add and track both income and expenses through an interactive dashboard. The app offers rich data visualizations, including bar charts and pie charts for income and line charts and pie charts for expenses, giving a clear overv

Resources

Stars

Watchers

Forks

Releases

Packages

Contributors

Languages