Simple income/expense tracker app web frontend built with React and 💕
This is the Expense Tracker Web frontend for Expense Tracker 💰 Lumen backend. You can find the backend repo and API documentation in the above link.
Basic features include -
- Landing Page
- Login and Registration
- Update Profile
- Update Password
- Income/Expense Category Manage
- Income/Expense Transaction Manage
- Income/Expense Calendar View
- Currency Support
- Language Selection (needs locale files)
- Tools Sidebar with Calculator
- Current and Last Month Summary
- Month Wise Income Expense Chart
- Category Wise Income Expense Chart
- Responsive UI
- At first download or clone Expense Tracker 💰 Lumen backend. Setup and configure the backend. Click the link for detail.
- Considering the backend is up and running, now download or clone this repo.
- Open terminal and
cdinto the directory. - Run
npm ito install the dependencies. - Copy and save
.env.examplefile as.env. Set API host in the.envfile if necessary. - Finally run the app with
npm start. - The app should be running at
http://localhost:3000
Some libraries used that deserves mentioning.
- Prime React - The UI components used in the project on top of free template Sigma.
- React Tracked - Simple and fast global state manager. Eliminate unnecessary re-renders.
- React Hook Form - Performant, flexible and extensible forms with easy-to-use validation.
- React Calculator - Modified to adjust my tools sidebar.
Additionally I have added a custom template in the extra folder. The template is designed and created solely by me. The name is blueberry-orange. Which is not free to use or copy without permission.
- Landing
This project is solely made for learning purposes. The structure of the project and the code practices may prove useful to new learners who are exploring new technologies.
Spare a ⭐ to keep me motivated. 😃
![@dependabot[bot]](https://avatars.githubusercontent.com/in/29110?s=64&v=4){kind=small}