coreygans / 654pwa

Finance Tracker

About

The Finance Tracker allows you to add financial transactions and see charts that provide insight into your spending behavior.

Functionality mocked

• Slide out form to add transactions
• Delete option for transactions with confirmation modal
• Edit modal (just for first transaction) to make changes to existing transactions
• Charts that summarize by Category and Month

Accessing Finance Tracker

Go to https://coreygans.github.io/654PWA/public and you'll be able to see the Finance Tracker which is linked to this repo and automatically updated as changes are made to the main branch.

Setup

1. git clone [email protected]:coreygans/654PWA.git
2. Once you have the repo locally, open it in VS code and use the Live Server Extension to launch it locally
3. Make sure you open it in the private browser window to ensure caching isn't impacting your experience

Using the app

1. Signup for an account. Make sure you don't use any of these email addresses:
   1. [email protected]
   2. [email protected]
   3. [email protected]
   4. [email protected]
   5. [email protected]
   6. [email protected]
   7. [email protected]
   8. [email protected]
2. After signing up, you can verify that you are logged in by clicking on the Account link in the header
3. Click on Add Transaction to add a new transaction to the table shown on the main screen
4. After adding a transaction, refresh your browser to see it in the table
5. From there you can edit or delete the transaction by leveraging the pencil or trash can icon
6. NOTE: The charts aren't currently tied to live data. This was an aspirational feature.
7. When you are finished, click Logout in the header