Acceptance Criteria

Upload Transactions page should accept an upload of a Chase transactions CSV.

We can then parse this CSV to add transactions to the DB.

We can give an indicator of a successful parse.

Technical Details

We don't need to store this file anywhere. After the user selects the file to upload, we should do a check to make sure the file is indeed a Chase CSV.

• File extension should be *.CSV

ACs:

• Create the Transactions schema/model (transaction.js) to facilitate storing and accessing transactions
• Populate Transactions collection with some sample data
• Display a list of links which bring you to the Edit Transactions page for that particular transaction.
  • For example, if I clicked into a transaction with ID: 325, I'd be redirected to the route /dashboard/edit/325
  • The links are transactions that have the "inspected" flag set to FALSE

Related Issues:
#17 Analysis: Data Model

This is a good opportunity to learn a supporting technology

Acceptance Criteria

• Look into the following:
  • Jest
  • Mocha
  • Jasmine

ACs:

• User info header
• Add Category collection Schema
  • Write a script to populate the Collection with some sample Categories
• Update the transaction population script with some of the added categories
• The "Add Budget" button should trigger a modal to appear
• The modal should allow us to specify a budget Name, the various categories, and the amount
  • We should be able to select from any available categories for our budget to encompass
  • We should be able to add categories within the "Add Budget" modal
    • Consider that this functionality will be used throughout our application, such as when we add transactions or edit transactions. We may want to componentize it somehow.
    • Add clientside and serverside validations

Acceptance Criteria:

• Complete the dependent tickets
• The Dashboard will be a functional mockup

Dependent Tickets

• #29 User Info Mockup
• #30 Nav Bar Mockup
• #31 Uninspected Transactions Component
• #32 Budget Component

Acceptance Criteria:

Have a general idea of what necessary table we'll have

It would be useful to have a Design Doc template where we can put the details of a particular issue, such as what changes had to be made and how to test the ticket.

Technical Details:

• Reminder to turn tracking back on for app.js
git update-index --no-assume-unchanged <file>

Related to:
#7

Do research on how React might enhance the application.
Do research into using Bootstrap for Phase 1

Acceptance Criteria:

• Have a front-end solution that has a low learning curve.

ACs:

• Combine readonly and edtiable User Info components in the Dashboard View
• Add field labels
• Break down the logic in dashboardEventListener into the given functions

Technical Details:

• We can just use the same input fields but with a readonly attribute
• Make sure to style the readonly input fields

• The individual budget component
  • Display the name
  • Display progress bar
  • Field for "Total Remaining"
  • Red "X" appended, when clicked, will delete the budget
  • Ability to edit the budget

Look into tools for the future of the application

• Bundlers

  • Parcel
  • Webpack

• Deployment

  • Netlify
  • Vercel
  • Heroku

• Automated Testing

  • Travis CI
  • Circle CI
  • Jenkins

• Linters

  • eslint

Research using the Chase Bank API and if necessary, utilizing Open Financial Exchange.

Acceptance Criteria:

By the end of our analysis, we want to successful retrieve a transaction from Chase bank.
Leave sample code and screenshots on this issue.

Additionally, we want to do some research on existing apps like Firefly III. Knowing how they store transactions might be useful to us in development. We can add these observations to #9 if they seem appropriate.

Technical Details

Reference: https://stackoverflow.com/questions/7269668/is-there-an-api-to-get-bank-transaction-and-bank-balance
http://www.ofxhome.com/index.php/home/directory
https://www.ofx.net/

Acceptance Criteria:

Currently, validation is handled using library express-validator on an ad-hoc basis.

This ticket is to identify and add in/update validations across the application whenever we do a DB write in the backend.

Acceptance Criteria:

• User Progress Bar
  • Can be a mockup, we just want an example of a visual UI component
• User Details
  • Simple user details display
• Edit button
  • The edit button should allow us to edit the "User Details" fields (it should overwrite the entry in the DB)

Do research into client-side dependency management. We may need certain libraries for client side functionality.

Create a repo for the sample app and just demonstrate how it can be done.

#29 depends on this being complete
#33 provides some background on our client-side dependency management analysis

• Update Init View
• Update Dash View
• Update instances of "takeHome" with "monthlyWage"

Acceptance Criteria:

Look into core functionality of Bootstrap. At the end of this analysis, you should be able to understand how to make a simple site using the frontend library. Practice making a mockup of the Budget App's frontend dashboard using Bootstrap.

We'll be using this library on a basic level for our frontend in Phase 1.

Acceptance Criteria:

This page is accessible through the associated Budget link.

On this page, we'll be able to edit each of the budget fields and either cancel or save the edits.

Acceptance Criteria

After core feature analysis is done, create a mockup diagram of the model structure in MongoDB.

The goal here is to understand our routing and what tables we'll want based on the features we want to support.

Dependencies

• #9

https://getbootstrap.com/docs/5.0/getting-started/accessibility/
https://www.a11yproject.com/

Acceptance Criteria

• Fields:
  • First name
  • Last name
  • Biweekly takehome (after all deductions and taxes)
  • Field to enter in "Current Financial Goal"

Technical Details

• We'll need to create the User table at least, but we might as well set up all the initial tables
  • We should test writing some values to them

Acceptance Criteria:

• Fixed transactions
• Transactions organized by month

Acceptance Criteria:

We have a connection to MongoDB Atlas through Mongoose

Technical Details:

• Reference page: https://developer.mozilla.org/en-US/docs/Learn/Server-side/Express_Nodejs/mongoose

1. Create a Cluster in MongoDB Atlas
2. Create a DB in MongoDB Atlas
3. Get the connection string
4. Copy the following code into app.js

//Set up mongoose connection var mongoose = require('mongoose'); var mongoDB = 'insert_your_database_url_here'; mongoose.connect(mongoDB, { useNewUrlParser: true , useUnifiedTopology: true}); var db = mongoose.connection; db.on('error', console.error.bind(console, 'MongoDB connection error:'));

Acceptance Criteria:

Initial dependencies are installed so we can use them during development

Make sure the following are installed

• nodemon
• mongoose
• express-validator
• async js
• jade/pug

Technical Details:

• Use --save-dev flag when appropriate
• Update package.json with scripts for running nodemon

Narrow down the core features and technologies

Acceptance Criteria

• txt file with core features, technologies, including a brief description of the layout of the site (include routes if possible)

Acceptance Criteria:

• Have a working express application skeleton

Technical Details:

• Express is already installed globally on our system
• We can run >express XXXX and >npm install to create our express app framework and install dependencies

https://bootstrapious.com/p/bootstrap-sidebar

Acceptance Criteria:

• Create a mockup of the navigation bar

• Nav bar

  • Home
  • Upload Transactions
  • Add Transactions
  • Spending breakdown
  • About Page

Acceptance Criteria:

Complete the TODO-list overview of React on MDN (https://developer.mozilla.org/en-US/docs/Learn/Tools_and_testing/Client-side_JavaScript_frameworks/React_getting_started).

The goal of this analysis is to prepare for componentizing our frontend in Phase 2. We'll have to test our components using a framework such as Mocha or Jest, but for now, we'll just need to learn React to prep for Phase 2.

Do research into whether using Typescript would benefit the organization of this project.