Spendar

Spendar was built for personal use. It's a mobile finance tracking app built with React Native and Expo, designed to help users understand their spending habits and gain better control over their personal finances.

Overview

Spendar focuses on clarity and simplicity. Instead of overwhelming users with complex dashboards, the app highlights meaningful insights such as spending patterns, top categories, and behavioral trends.

The project is currently a prototype and under active development.

Features (Current)

• Dashboard with financial overview (income vs spending).
• Spending insights (daily trends, top merchants, categories).
• Calendar-based spending visualization.
• Transaction search functionality.
• Clean tab-based navigation (Dashboard, Insights, Transactions, Settings).

Screens

Home Screen

• Entry point with branding and CTA.
• Navigates into the app experience .

Dashboard

• Overview of total spending and income.
• Highlights and calendar visualization.

Insights

• Aggregated analytics (daily, weekly, monthly).
• Spending behavior visualizations.

Transactions

• Search and filter transactions.

Settings

• User settings and preferences (basic structure in place).

Tech Stack

• React Native.
• Expo Router.
• TypeScript
• Custom component system.
• Local JSON data (temporary).

Architecture

The app uses Expo Router with a tab-based navigation structure:

• Root stack layout → handles navigation flow.
• Tabs layout → main app navigation .
  • Dashboard.
  • Insights.
  • Transactions.
  • Settings.

The UI is built with reusable components such as:

• Wrappers (layout consistency).
• Insight containers.
• Calendar and highlight components.

Current Limitations

• Uses mock data instead of real transactions.
• No authentication yet.
• No backend or persistence layer.
• No bank/API integrations.
• Limited error handling.

Planned Features

• Real data persistence (local storage or backend).
• Bank integration / transaction import (CSV or API).
• Categorization of spending (auto + manual).
• Authentication and user accounts.
• Improved insights (AI-based suggestions).
• Export functionality (CSV / reports).

Getting Started

# Install dependencies
npm install

# Start development server
npx expo start