Xpense tracker is a sleek, real-time personal finance manager and expense triage system. It automatically ingests financial transaction SMS alerts directly from your Android phone, parses the amount, merchant, and transaction date, and feeds them into a dashboard where you can easily categorize them.
Designed with Next.js 15 (App Router), Supabase, and styled using Vanilla Tailwind CSS, it is built to run fast and look premium.
| Dashboard Overview | Analytics Insights |
|---|---|
 |
 |
You can watch the product demo here: Xpense Product Demo (product-demo.mp4)
- Real-time SMS Ingestion: API endpoint
/api/ingestbuilt specifically for phone automation tools like MacroDroid. - Smart Ingestion Parser: Automatically extracts merchant, transaction type (income/expense), amount (in INR/Rs.), and date from standard transaction alerts.
- Instant Dashboard Triage: View, triage, and categorize your uncategorized expenses dynamically using real-time database subscriptions.
- Beautiful Analytics: An interactive donut and bar chart overview of your spending history, categories, and income trends.
Anyone can clone and run their own copy of this tracker. Follow the steps below to set it up:
Create a free project on Supabase and execute the following SQL in the SQL Editor to create the expenses table:
CREATE TABLE expenses (
id UUID DEFAULT gen_random_uuid() PRIMARY KEY,
created_at TIMESTAMPTZ DEFAULT NOW(),
amount NUMERIC NOT NULL,
merchant TEXT NOT NULL,
raw_message TEXT NOT NULL,
category TEXT DEFAULT 'Uncategorized',
type TEXT DEFAULT 'expense'
);
-- Optional: Enable Indexes for speed
CREATE INDEX idx_expenses_category ON expenses(category);
CREATE INDEX idx_expenses_created_at ON expenses(created_at DESC);Create a .env.local file in the root directory (this file is ignored by Git to keep your credentials safe):
NEXT_PUBLIC_SUPABASE_URL=https://your-supabase-project-id.supabase.co
NEXT_PUBLIC_SUPABASE_ANON_KEY=your-anon-key
SUPABASE_SERVICE_ROLE_KEY=your-service-role-key
API_INGEST_SECRET=your-super-secret-token-hereDeploy the Next.js app to Vercel:
- Import your cloned GitHub repository.
- Add the environment variables from your
.env.localto the Vercel project configuration. - Deploy! You will receive a production URL (e.g.,
https://your-app-name.vercel.app).
You can also deploy directly using this Vercel Deploy button:
To forward incoming transaction SMS alerts to your web app in real-time, configure MacroDroid on your Android device:
- Trigger:
SMS Received - Sender: Select the contact names/codes of your banks (e.g.,
AD-ICICIB,HDFCBK) or selectAny Senderif you want to filter messages on your own. - Message Content:
Matches wildcard->*Rs*or*INR*(to only capture messages containing transactions).
- Action:
HTTP POST - URL:
https://your-deployed-app-url.vercel.app/api/ingest - Content Type:
application/json - Header: Add a new header with Name:
x-api-secretand Value:your-super-secret-token-here(to match your environment variable). - JSON Body:
(Note:
{ "raw_message": "[sms_message]" }[sms_message]is a MacroDroid magic text variable that automatically expands to the contents of the received text message).
If you are setting up this tracker for yourself and need assistance with the MacroDroid macro configuration, database schema, or hosting deployment:
👉 Contact me — I will gladly help you get it running!
- 📧 Email: fawaz0212kb@gmail.com
- 💼 LinkedIn: Fawaz Ahamed
Run the development server locally:
npm run devOpen http://localhost:3000 in your browser to test.
Does your bank use a different SMS format? Open a Pull Request and add your bank's regex to the parsing engine! All contributions to expand bank format support are highly appreciated.
This project is licensed under the MIT License. See the LICENSE file for details.