Fullstack Expense Tracker App
Track spending habits and be in control of spending to achieve your financial goals! 😄
Toggle for both modes: ease your eyes at night by pressing the moon icon and adjust to the day by pressing the sun icon!
Total income and expense at a glance
Monitor and delete your transactions
Various array of choices
- MongoDB
- Express
- ReactJS
- NodeJS
- Deployed using Heroku
- RESTapi ==> API
Clone main branch of git repository to desired directory with git clone
git clone https://github.com/thchong-code/ExpenseTracker.git
Run npm install in console inside the root of ExpenseTracker to install all dependencies.
Create a file named config.env inside the config folder & add in the following:
MONGODB_URI= (create a database in mongoDB Atlas paste the link to connect here, remember to include inverted commas) NODE_ENV=production PORT=5000
To start the app locally, run npm run dev in console which starts up both frontend and backend concurrently. Remove the Auth wrapper from index.js in client folder and App.js to remove Auth0.
- Support for mobile devices
On iOS devices, visit site on Safari Browser and click the share icon and add page to homescreen
- Dark/ Light Mode with remember function or will set based on device default settings
- Add an item and its expense/ income
- Delete item
- Displays account balance on a pie chart + income & expense values
- Auth0 login
- Fix chart grid font color in dark mode
Adapted from Vanilla projects and converted to ReactJS:
HCTANG - feel free to contact me!