About stuFi

stuFi (Student Finance) is a responsive web application designed to help students manage their budgets, track spending, and develop better financial habits.

Built with vanilla HTML, CSS, and JavaScript, stuFi demonstrates modern web development practices including semantic HTML, mobile-first responsive design, accessibility features, and modular JavaScript architecture.

Key Features

  • Track income and expenses with customizable categories
  • Set spending caps with real-time ARIA live alerts
  • Search transactions using powerful regex patterns
  • View spending trends and statistics on the dashboard
  • Export/import data as JSON with validation
  • Currency conversion support (GBP, USD, EUR)
  • Fully keyboard-navigable interface
  • Screen reader compatible with ARIA live regions

Technology

  • Semantic HTML5 with proper landmarks and headings
  • Mobile-first CSS with Flexbox and media queries
  • Vanilla JavaScript with ES modules
  • localStorage for data persistence
  • Regular expressions for validation and search

Relevant Links