Building a Practical Finance Dashboard with Next.js and Supabase

Finance tools are only useful if they are accurate, understandable, and easy for non-technical users to operate. I wanted this project to feel like a real operational tool instead of a UI shell around a database.

What I built

• A fund and transaction management workflow with multiple finance categories and account views.
• Contribution tracking for individual members plus reporting across months and funds.
• Role-based access so admins, treasurers, and viewers can use the same system safely.
• Dashboard and reporting surfaces that summarize balances and recent activity without burying the important numbers.

Technical decisions

• Used Next.js and Supabase to keep auth, database access, and deployment aligned with a fast delivery cycle.
• Structured the data around the finance domain first so reports and summaries stay consistent with the underlying records.
• Kept the UI clean and direct because operational software lives or dies on trust and legibility.

Why this project matters

• It is a strong full-stack example with real data relationships and business rules.
• It shows product judgment around admin UX, not just component assembly.
• It gives hiring managers a concrete example of building software that people would actually rely on.

Links

• GitHub: https://github.com/neutral-Stage/church-finance
• Live URL: https://church-finance-theta.vercel.app/
• Primary language: TypeScript

Takeaway

This project reflects the kind of work I enjoy most: shipping practical software, tightening the developer or user workflow, and documenting the technical decisions clearly enough that another engineer can pick it up and keep moving.