Hi there I'm Jerome a student pursuing web development. I'm excited to share my first MERN stack project an expense tracker. This app allows users to add delete and update their expenses and income and it automatically deducts expenses from the user's current income. The app is also responsive so it looks great on both desktop and mobile devices. In addition to its core functionality the expense tracker also includes interactive components such as charts and cards. These components help users to visualize their spending habits and get insights into their spending.
https://expensetracker-36xy.onrender.com/
Here're some of the project's best features:
- User : Can Add Edit Delete Update There Expenses Reminders And Income
- User : Can Login and Sign Up
- JWT Authentication
- Interactive Chart and Cards
- Complete Route Implementation using React Router
- Mobile First Principle (Responsive 90%)
- Complete Validation Schema on Input fields
Here're some of the tools and stack use and development span:
- 🖱️ We use Mern Stack ( React
▶️ Frontend , Express▶️ Backend , MONGO DB▶️ DATABASE , NODE▶️ RUNTIME ENV ) - 🖱️ Yup For all input fields and forms schema
- 🖱️ Formik For Creating Form
- 🖱️ React Query for Fetching Data
- 🖱️ Axios for http request
- 🖱️ Chart.js for Interactive Chart
- 🖱️ animate.css for animation
- 🖱️ React Router for Managing and Creating Routes
- ✨ My Expense Tracker is a rush project, so I haven't refactored any of the code. I worked on the project for two weeks with no planning, just coding. I'm grateful for my experience on my previous simple project, which helped me a lot and since it is my first mern stack project i am happy when im presenting it on my class .
- ✨ I will continue this Project when Our capstone is Done because there is a lot of things need to change in this web app i created Thanksss
React
Typescript
Django
Laravel
Facebook
Microsoft
Google
Alibaba
D3
Tencent