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