yamisagi/expense-tracker-react

A simple React app to track your expenses. With this app, you can add your expenses and filter them by year.

Expense Tracker

A simple React app to track your expenses. With this app, you can add your expenses and filter them by year.

About Me 💙»

📫 How to reach me

How To Run This Project 🚀

• Clone the repo

  git clone

• Install NPM packages

  npm install

• Run the project

  npm start

• Open the project on your browser

  http://localhost:3000/

• Enjoy! 🎉

(back to top)

About The Project

In this repository, I will build a simple React app to track your expenses. With this app, you can add your expenses and filter them by year.

Roadmap

• Project Setup
• Adding a New Expense Component
• Add SCSS to the project
• Create Expense Item Component & ExpenseCalendar Component
• Create ExpenseForm Component & NewExpense Component
• Add useState to the project & Add Expense Data
• Add useRef to the project & Use it for Form
• Use Previous State & Add Expense Data
• Add UUID to the project & Add ID to the Expense Data
• Add Two-Way Binding & Clear Form
• Create Home Page
• Add Filter Component & Filter by Year
• Implement Filter Logic
• Add Conditional Return Statements
• Add Expenses Chart Component
• Add Chart Component
• Add Chart to the Home Page
• Project Done 🎉
• Deploy the project to Netlify 🚀

(Still working on it...)

(back to top)