💰 Expense Tracker (React & UI)

A simple, responsive expense tracking app built with React, JavaScript, HTML, and CSS. Users can add expenses with a title, amount, and category, view a running total, filter by category, and delete entries.

Features

• Add new expenses with title, amount, and category
• Real-time total calculation
• Filter expenses by category
• Delete individual expenses
• Clean, responsive UI with custom CSS (no external UI library)

Tech Stack

• React (functional components + hooks: useState, useMemo)
• JavaScript (ES6+)
• HTML5
• CSS3 (custom styling, flexbox layout)

Project Structure

expense-tracker-react/
├── package.json
├── public/
│   └── index.html
└── src/
    ├── index.js
    ├── App.js
    ├── App.css
    └── components/
        ├── ExpenseForm.js
        ├── ExpenseList.js
        └── ExpenseItem.js

How to Run

1. Make sure Node.js is installed.
2. Open a terminal in this project folder.
3. Install dependencies:

   npm install
   

4. Start the development server:

   npm start
   

5. Open http://localhost:3000 in your browser.

Possible Enhancements

• Add local storage to persist data between sessions
• Add charts (e.g., pie chart of spending by category) using Chart.js or Recharts
• Connect to a backend (Node/Express or Python Flask) for multi-user support