Budget Tracker is a simple to use Progressive Web Application/PWA project application that allows users to keep track of their expenses. The project was completed as a demonstration of creating offline functionality and operating as a PWA. Using IndexedDb, transaction data is saved to the browser, and pushed to a MongoDB database on reconnection. Additionally, it uses a simple Service Worker to cache important files and a web manifest file to make it a downloadable PWA. Fully deployed here on Heroku.
User Story:
AS AN avid traveler
I WANT to be able to track my withdrawals and deposits with or without a data/internet connection
SO THAT my account balance is accurate when I am traveling
Starter code provided by GWU's Coding Bootcamp. The fully deployed application is available here on Heroku. If you are interested in working with this code base, follow these instructions:
git clone
npm install
npm start
http://localhost:3001
to use the application locallyTo install the Budget Tracker PWA, navigate to the [deployed URL](). On the right side of the URL, click the Install Budget Tracker download button to install the application on your local machine.
Budget Tracker is super simple to use! Input a name for your transaction, dollar/currency amount, and select whether this transaction will be adding or subtracting funds. The graph will immediately update to display your updated budget on success. If using this application on a severed or weak connection, all functionality is the same, but when a connection is re-established your transactions will be automatically pushed to the online Mongo database.
Demonstrated here, a transaction is successfully made with no internet connection, and once a connection has been re-established, the data is pushed to the database:
Technologies Used:
If you have any questions about the application, would like to check out more of my work, or would like to become a contributor, please contact me using the information below: