Skip to content

nanthakumar-m/Expense-Tracer-Html-Css-Javascript

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

6 Commits
 
 
 
 

Repository files navigation

💸 Expense Tracker – HTML | CSS | JavaScript

The Expense Tracker is a fully interactive web application that allows users to manage their daily spending. Users can input expenses with relevant details like amount, category, and date. The app displays all entries in a dynamic table and provides real-time total calculation, category filtering, and basic edit/delete functionality.

The aim of this project was to gain practical experience with DOM manipulation, dynamic table generation, event handling, and array operations in JavaScript. It simulates a mini financial tracker

🔗👉 click here to see the live demo--> https://nanthakumar-m.github.io/Expense-Tracer-Html-Css-Javascript/

⚙️ Technologies Used

  • HTML5
  • CSS3
  • JavaScript

💡Core Features

✅ Add new expenses with category, amount, and date

✅ Edit and delete individual expense entries

✅ Calculate and display total expense in real time

✅ Filter expenses by category

✅ Dynamically update table rows and totals with pure JavaScript

🎯 What I Gained / Concepts Practiced

✅ Improved logic building using arrays and object structures

✅ Hands-on experience with event-driven programming

✅ Enhanced knowledge of table creation and dynamic content rendering

✅ Practiced form validation and filtering logic

📸 Screenshots

image

image

image

image

About

A functional expense tracking app that lets users add, edit, delete, and filter expenses. Also calculates total spending dynamically.

Topics

Resources

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published

Languages