Expense Tracker App

This is an app to help track expenses. Users can register and login to track their expenses or login using the demo account.

Live Site

Technologies Used

  • React.js
  • Node.js
  • Postgresql

Launch

  1. Fork and clone the repo
  2. 'npm install' in the directory
  3. create the database and run 'npm run migrate' in the database
  4. m start' or 'npm run dev' to start the server

Functionality

The app uses GET requests to pull the expense information off the database. POST requests get sent to the database for adding expenses, logging a user in and creating a new user. DELETE requests are called when deleting an expense. In the future I would like to add in PATCH requests for both expenses and userss.

Users

For Posting and Getting user accounts

{
  full_name: string,
  email_address: email,
  username: string,
  password: string
}

Expense

For Posting, Getting and Deleting expenses

For Posting, Getting and Deleting expenses
{
  expense: integer,
  description: string,
  user_id: integer,
  date_created: timestamp,
  id: integer
}

Auth

For Posting to the Authentication of a user

{
  username: string,
  password: string
}

API Overview

 /api
 .
 |-- /auth
 |    |__ POST
 |          |-- /login
 |-- /users
 |      |__ GET
 |           |-- /
 |      |__ POST
 |           |-- /
 |-- /expenses
 |       |__ GET
 |            |-- /
 |            |-- /:expense_id
 |       |__ POST
 |            |-- /
 |       |__ DELETE
 |            |-- /:expense_id

POST

/api/auth/login

// req.body
{
 username: string,
 password: string
}
// res.body
{
 authToken: string
}

GET

/api/users

// res.body
{
  username: string,
  password: string,
  full_name: string,
  email_address: email
}

POST

/api/users

// req.body
{
  username: string,
  password: string,
  full_name: string,
  email_address: email
}

//res.body
{
  username: string,
  password: string,
  full_name: string,
  email_address: email
}

POST

/api/expenses

 // req.body
 {
  expense: integer,
  description: string,
  date_created: timestamp,
  id: integer,
  user_id: integer
}

// res.body
 {
  expense: integer,
  description: string,
  date_created: timestamp,
  id: integer,
  user_id: integer
}

GET

/api/expenses

//res.body
{
  expense: integer,
  description: string,
  date_created: timestamp,
  id: integer,
  user_id: integer
}

Project Status

This is a Minimal Viable Product (MVP)

Landing Page

Screen Shot 2020-04-10 at 11 30 36 AM

Login Page

Screen Shot 2020-04-10 at 11 30 48 AM

Registration Page

Screen Shot 2020-04-10 at 11 30 59 AM

Expenses Page

Screen Shot 2020-04-10 at 11 31 13 AM