case study · 2019 · 2026

Expensify: a course project grown into a secure full-stack app

A full-stack expense tracker with private accounts: log, filter, sort and total your expenses. Started as a course project and rebuilt with a real API, authentication and 97 tests.

Live demo Source code
role
Solo project
timeline
2019, updated 2026
stack
React, Redux, Node.js, Express, MongoDB, Jest
status
Live demo
Screenshot of Expensify
01

What it does

  • Sign up and log in; sessions last seven days and survive refreshes.
  • Add, edit and remove expenses with a description, amount, date and note.
  • Search, sort and filter by date range, with a running count and total.
  • Clear validation, loading and empty states, on desktop and mobile.
02

Security-minded auth

  • Passwords hashed with Node's scrypt and a per-user salt, compared in constant time.
  • Signed session tokens in httpOnly, SameSite cookies that page scripts can't read.
  • Rate-limited login and sign-up that never reveal whether a user exists.
  • Every query is scoped to the signed-in user, taken from the session rather than the request.
03

Bringing it up to date

  • Converted class components to hooks and upgraded React, Enzyme and the Sass toolchain.
  • Replaced in-memory state with a real API and database, and added authentication.
  • Async Redux actions update the UI only after the server confirms, and an expired session sends you to log in and back again.
  • Fixed real bugs, including a crash on refreshing an edit page and two tests that never asserted anything.
04

Architecture

One Render service builds the React app and runs the Express API, serving both from the same origin.

  1. React + Redux
  2. Express /api
  3. MongoDB Atlas
05

Results

97
Jest & Enzyme tests
next projectContractor · Supplier