Skip to content

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

16 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

๐Ÿ’ธ MoneyMap - SaaS Banking Platform

Next.js TypeScript Appwrite Plaid TailwindCSS

A secure, full-stack financial management platform that allows users to link multiple bank accounts, view real-time transactions, and transfer funds. Built with Next.js 14, Appwrite, and Plaid.

๐Ÿ“– Overview

MoneyMap addresses the fragmentation of modern banking by unifying accounts into a single dashboard. It leverages Plaid for secure bank authentication and Dwolla for handling ACH payment transfers.

The application ensures type safety using TypeScript and manages secure backend processes (Database & Auth) via Appwrite, focusing on performance and security compliance.


๐Ÿ“ธ Dashboard Previews

Financial Dashboard Transaction History
Dashboard Transactions
Connect Bank Flow Tranfer Funds
Plaid Link Mobile

๐Ÿ› ๏ธ Tech Stack

Core Architecture

  • Framework: Next.js 14 (App Router, Server Actions)
  • Language: TypeScript
  • Styling: Tailwind CSS + Shadcn/UI
  • Form Handling: React Hook Form + Zod

Backend & Services

  • BaaS (Backend-as-a-Service): Appwrite (Auth, Database, Functions)
  • Banking API: Plaid (Account linking, Transaction data)
  • Payments: Dwolla (ACH Transfers)
  • Monitoring: Sentry (Error Tracking)

๐Ÿš€ Key Features

  • ๐Ÿ” Bank-Grade Security: Integration with Plaid Link ensures banking credentials are never stored on our servers.
  • ๐Ÿ’ธ Fund Transfers: Authorized users can initiate ACH transfers between connected accounts via Dwolla.
  • ๐Ÿ“Š Real-time Insights: Dynamic charts using Chart.js to visualize spending habits and income streams.
  • ๐Ÿ“ฑ Multi-Device Sync: Fully responsive UI optimized for mobile banking experiences.
  • ๐Ÿ‘ค Secure Auth: SSR-compatible authentication flows powered by Appwrite.

โšก Getting Started

Prerequisites

  • Node.js 18+
  • Appwrite Cloud Account
  • Plaid Sandbox Account
  • Dwolla Sandbox Account

1. Clone & Install

git clone [https://github.com/your-username/moneymap.git](https://github.com/your-username/moneymap.git)
cd moneymap
npm install

2. Environment Setup

Create a .env.local file in the root directory and add your keys:

# Appwrite
NEXT_PUBLIC_APPWRITE_ENDPOINT=[https://cloud.appwrite.io/v1](https://cloud.appwrite.io/v1)
NEXT_PUBLIC_APPWRITE_PROJECT=your_project_id
APPWRITE_DATABASE_ID=your_db_id
APPWRITE_USER_COLLECTION_ID=your_collection_id

# Plaid
PLAID_CLIENT_ID=your_plaid_id
PLAID_SECRET=your_plaid_secret
PLAID_ENV=sandbox

# Dwolla
DWOLLA_KEY=your_dwolla_key
DWOLLA_SECRET=your_dwolla_secret
DWOLLA_BASE_URL=[https://api-sandbox.dwolla.com](https://api-sandbox.dwolla.com)

3. Run Development Server

npm run dev

Visit http://localhost:3000 to view the application.


๐Ÿ“‚ Project Structure

  MoneyMap/
โ”œโ”€โ”€ app/                  # Next.js App Router Pages
โ”œโ”€โ”€ components/           # Reusable UI Components
โ”œโ”€โ”€ lib/                  # Utility functions (Plaid/Appwrite config)
โ”œโ”€โ”€ public/               # Static assets
โ””โ”€โ”€ types/                # TypeScript Interfaces

๐Ÿ”ฎ Future Roadmap

  • Integration with Stripe for Card Payments.

  • AI-powered spending predictions.

  • Dark Mode support.


๐Ÿ‘จโ€๐Ÿ’ป Author

Ayush Agarwal Java Full Stack Developer.

LinkedIn | Portfolio

About

A Next.js FinTech platform integrating Plaid and Dwolla for real-time banking, transaction tracking, and ACH transfers. Powered by Appwrite and TypeScript.

Topics

Resources

Stars

Watchers

Forks

Contributors

Languages