A Mobile-First Expense Tracker with Next.js + Supabase

EasySpend is my personal expense tracking platform built with Next.js 14 and Supabase. Beyond quick manual entry and clear analytics, it also supports automated expense ingestion: send a receipt photo via Telegram and an n8n + AI pipeline parses it, formats it, and adds it to your Supabase account.

Problem

People struggle to consistently track expenses because tools are slow on mobile, lack offline resilience, and don’t surface actionable insights. Spreadsheets and generic apps make it hard to quickly log purchases, visualize patterns, or stay motivated to build a habit.

Solution

I built a modern full-stack app using Next.js (App Router) and Supabase (PostgreSQL, Auth, Realtime). The app implements magic-link authentication, strict Row Level Security, and a clean expense schema. Users can add, edit, filter, and bulk-manage expenses with React Hook Form + Zod validations, while analytics provide category breakdowns, monthly trends, and daily heatmaps. In addition, an n8n workflow listens for Telegram uploads; an AI agent performs OCR and parsing, validates fields, then upserts the expense into Supabase—so snapping a receipt becomes a one-step add.

Results

Reflection

This project blends a great mobile UX with an automated ingestion pipeline that removes friction. The Telegram → n8n → AI flow turns receipt photos into structured entries with minimal effort, while Next.js + Supabase provide a secure, scalable backbone. With this foundation, the app is ready for extensions like budgets, recurring expenses, and receipt capture enhancements.