An elegant and efficient Expense Tracker built with React and TypeScript
This project is an expense tracker that aims to provide a simple and efficient way to manage and track your daily expenses. Powered by React and TypeScript, it offers robust performance and type safety.
✅ Add new expenses
✅ Edit existing expenses
✅ Delete expenses with a smooth animation
✅ Search by expense name
✅ Filter expenses by date
✅ Sort by name, price, or date
✅ Data persistence with local storage
✅ Display total expense amount (and filtered if any)
✅ Dark/Light theme toggle feature to improve user experience by allowing customization of the app's appearance
✅ Responsive design
🛠️ Built With
- Node.js >= 14.x
- npm >= 6.x
-
Clone the repository
git clone https://github.com/kraffcho/Expense-Tracker-with-TypeScript-and-React.git
-
Navigate to the project folder
cd expense-tracker-react-typescript -
Install dependencies
npm install
-
Start the development server
npm start
Visit http://localhost:3000 in your browser, and you're good to go! Add your expenses, sort them, and have a bird's eye view on your spending.
Contributions are what make the open-source community such an amazing place to learn, inspire, and create. Any contributions you make are greatly appreciated. Here's how you can contribute:
- Fork the Project
- Create your Feature Branch (
git checkout -b feature/amazing-feature) - Commit your Changes (
git commit -m 'Add some amazing feature') - Push to the Branch (
git push origin feature/amazing-feature) - Open a Pull Request
Demo link: https://zg63fc.csb.app/
Distributed under the MIT License. See LICENSE for more information.