https://expenses-incomes-tracker.netlify.app
An intuitive web application designed to help users efficiently manage their finances by tracking their incomes and expenses. Built with React and styled using Material-UI, this application offers a seamless and visually appealing user experience. One of its standout features is the integration of local storage, allowing users to conveniently save their input data, ensuring that their financial records are easily accessible and persistent across sessions. With its user-friendly interface and robust functionality, the Income and Expense Tracker empowers users to make informed financial decisions and maintain better control over their finances.
This is the Lighthouse Google report showcasing Performance 🚀, Accessibility ♿️, Best practices ✅, and SEO 🔍.
| Technology | Description | Link |
|---|---|---|
| Github licence | License badge | GitHub License |
| JavaScript Badge | JavaScript badge | JavaScript |
| Material-UI Core Version | Version of Material-UI Core | Material-UI |
| Material-UI Icons Version | Version of Material-UI Icons | Material-UI Icons |
| Material-UI Lab Version | Version of Material-UI Lab | Material-UI Lab |
| Jest-Dom Version | Version of Jest-Dom | Jest-Dom |
| React Testing Library Version | Version of React Testing Library | React Testing Library |
| User Event Version | Version of User Event | User Event |
| Chart.js Version | Version of Chart.js | Chart.js |
| React Version | Version of React | React |
| React Chartjs 2 Version | Version of React Chartjs 2 | React Chartjs 2 |
| React DOM Version | Version of React DOM | React DOM |
| React Scripts Version | Version of React Scripts | React Scripts |
| UUID Version | Version of UUID | UUID |
| Web Vitals Version | Version of Web Vitals | Web Vitals |
| Local Storage | Local Storage badge | Local Storage |
| Netlify Status | Netlify status badge | Netlify |
Users can clone the code and run npm install to install the dependencies
npm install
Afterwards users can run the command npm run build which will run the Vite build process which will bundle the React source code
npm run build
Afterwards users can run the command npm run dev which will executes the vite command, which starts the development server provided by Vite
and allows users to run the code on their local host
npm run dev
This sequence ensures that your client-side code is built before starting the server.
Package.json dependencies ⚙️
Have fun!
Landing page
GIF
Showcasing Homepage, adding a item to the cart and scroll button
This project is licensed under MIT
N/A
N/A
If you have any questions about this project, please contact me directly at brian.trang9@gmail.com. Feel free to view more of my projects at https://github.com/Makeredundant.