Skip to main content

Developed a full stack financial platform

Connects to multiple bank accounts, displays transactions in real-time, allows users to transfer money to other platform users, and manages their finances altogether.

  • Next.js, React, Typescript
  • Appwrite, Plaid, Dwolla
  • React Hook Form, Zod, Chart.js
  • TailwindCSS, ShadCN UI
Badger bank a full stack financial platform

✨ Key Features

  • 🔐 Secure Authentication: SSR-based login with robust validation and session handling
  • 🏦 Bank Integrations: Connect multiple banks through Plaid and view real-time data
  • 📊 Dashboard Overview: Displays total balance, categorized spending, and recent transactions
  • 🔍 Transaction History: Fully filterable and paginated log of past transactions
  • 🔄 Real-Time Sync: Updates all views immediately when a new account is connected
  • 💸 Funds Transfer: Use Dwolla to securely transfer money to external accounts
  • 📱 Responsive Design: Optimized layout for desktop, tablet, and mobile devices

🔄 How It All Connects

  • VUser logs in with Appwrite
  • Links a bank using Plaid
  • Dashboard updates with data fetched via Plaid and stored in Appwrite
  • User initiates a transfer with Dwollaa
  • Transfer result is recorded and shown in Appwrite’s UI
  • Every interaction—auth, fetch, transfer—is validated, stored, and reflected in real-time

🏦 Plaid
(Banking Data Integration)

  • Bank Linking: Users connect their real bank accounts via Plaid’s secure OAuth-like interface.(SSR)
  • Data Sync: Once connected, Plaid sends encrypted financial data:
    • Account balances
    • Transaction history
    • Spending categories
  • Real-Time Updates:This data is pulled and synced with Appwrite’s database so your dashboard is always up-to-date.

The homepage of the aero design system docs website linking to principles and components.

💸 Dwolla (Fund Transfers)

  • Transfers: Dwolla handles ACH (bank-to-bank) transfers between users on the platform.
  • Recipient Management: When a user enters a recipient’s Dwolla ID and transfer details, the app:
    • Validates the input with Zod & React Hook Form
    • Sends the transfer request to Dwolla’s API
    • Logs the transfer status in Appwrite’s database
  • Sandbox Mode: For development, Dwolla runs in test mode using fake money to simulate real transfers.

A drag and drop storyboard style editor for creating an adaptive lesson.
A set of themed components for the aero design system

🛡️ Appwrite (Auth & Database)

  • Authentication: Manages user registration, login, and session handling using secure server-side rendering (SSR)
  • Database: Stores all non-sensitive app data:
    • User profiles
    • Linked bank accounts (via Plaid IDs)
    • Transaction metadata
    • Transfer history
  • Authorization: Ensures users only access their own data across all pages