Expense Tracker

Introduction

The "Expense Tracker" is a full-stack web application designed to help individuals securely manage their personal finances. This document outlines the system requirements for the Expense Tracker, focusing on individual use with secure authentication and personalized financial management features.

System Overview

The Expense Tracker application allows users to create an account, log in securely, and manage their income and expenses through a personalized dashboard. The application employs JWT-based authentication and bcrypt password hashing to ensure user accounts are protected. Users can perform CRUD operations on their transactions, categorize them, and visualize spending patterns. The system is designed for individual use, ensuring that each user's data is isolated and secure.

Functional Requirements

• As a user, I should be able to register and create an account with secure authentication.
• As a user, I should be able to log in securely using JWT-based authentication.
• As a user, I should be able to view a personalized dashboard displaying my total income, expenses, and current balance.
• As a user, I should be able to add, edit, delete, and view my income and expense transactions.
• As a user, I should be able to categorize my transactions (e.g., Food, Travel, Shopping, Salary).
• As a user, I should be able to search and filter my transactions.
• As a user, I should be able to visualize my spending patterns using charts for monthly and category-wise expense analysis.
• As a user, I should have the option to export my transaction history in CSV or PDF format.

User Personas

• Individual User: A person who wants to manage their personal finances securely and efficiently. They require features like secure login, transaction management, and financial analytics.

Core User Flows

• User registers an account -> logs in securely -> accesses personalized dashboard -> adds/edits/deletes transactions -> categorizes transactions -> views analytics -> exports transaction history (optional).

Visuals Colors and Theme

• primary: #2A9D8F (Teal)
• primary_light: #A8DADC (Light Teal)
• secondary: #E76F51 (Coral)
• accent: #F4A261 (Orange)
• highlight: #FFB703 (Amber)
• bg: #F1FAEE (Light Cream)
• surface: rgba(233, 233, 233, 0.8)
• text: #264653 (Dark Blue)
• text_muted: #6D6875 (Muted Gray)
• border: rgba(38, 70, 83, 0.2)

Signature Design Concept

The Expense Tracker's homepage will feature an interactive "Financial Journey Map" that visually represents the user's financial progress. Users can click on different milestones to view detailed analytics and insights. The map will use @react-three/fiber for a 3D effect, allowing users to zoom in and out, and explore their financial journey interactively. Hovering over milestones will display tooltips with quick stats, and clicking will transition to detailed views using framer-motion for smooth animations.

Interaction Model & Motion Direction

The landing page will use a "parallax" interaction model, creating a layered depth effect as users scroll through their financial journey. This will be complemented by animated transitions and hover effects for interactive elements, enhancing the storytelling aspect of the user's financial management experience.

Non-Functional Requirements

• The system must ensure secure authentication and data protection.
• The application should be responsive and accessible on various devices.
• The system should handle concurrent user sessions efficiently.
• The application should provide real-time updates on the dashboard.

Tech Stack

• Frontend: React for Web
• Backend: Python with FastAPI
• Database: MySQL or MariaDB, using Alembic for migrations
• Local Orchestration: Docker, docker-compose
• Server-side Orchestration: Kubernetes

Assumptions and Constraints

• The application is intended for individual use, not for multi-user or enterprise environments.
• User data is isolated and cannot be accessed by other users.
• The system assumes users have internet access to use the web application.

Glossary

• CRUD: Create, Read, Update, Delete operations.
• JWT: JSON Web Token, a compact, URL-safe means of representing claims to be transferred between two parties.
• Bcrypt: A password hashing function designed for secure password storage.
• Parallax: An effect where the position or direction of an object appears to differ when viewed from different positions.
• Alembic: A lightweight database migration tool for use with SQLAlchemy.