🏦 NU Bank - Modern Banking Platform

NU Bank is a modern, full-featured banking platform that provides users with seamless account management, real-time transaction monitoring, and secure payment processing. Built with cutting-edge technologies and following industry best practices.

✨ Features

🏠 Dashboard & Overview

Real-time Balance Display: Animated counters showing total balance across all connected accounts
Account Summary: Quick overview of all linked bank accounts with current balances
Recent Transactions: Live feed of recent banking activities
Responsive Design: Optimized for desktop, tablet, and mobile devices

🏦 Bank Account Management

Multi-Bank Connectivity: Connect multiple bank accounts via Plaid integration
Account Types Support: Checking, savings, credit cards, and more
Real-time Balance Sync: Automatic balance updates from connected institutions
Institution Details: Complete bank information and branding

💳 Transaction Management

Transaction History: Comprehensive view of all banking transactions
Real-time Sync: Automatic transaction updates from Plaid
Category Classification: Automatic transaction categorization
Advanced Filtering: Search and filter transactions by date, amount, or category
Payment Channel Tracking: Track transactions by payment method

🔄 Payment Transfer

Secure Transfers: Safe money transfers between connected accounts
Dwolla Integration: Professional payment processing infrastructure
Transfer Status Tracking: Real-time transfer status updates
Transfer History: Complete record of all money transfers

🔐 Security & Authentication

Secure Authentication: User authentication and session management
Data Encryption: All sensitive data encrypted in transit and at rest
Bank-level Security: Industry-standard security protocols
Error Monitoring: Sentry integration for real-time error tracking

📊 Analytics & Insights

Interactive Charts: Beautiful data visualizations using Chart.js
Balance Analytics: Visual representation of account balances
Spending Patterns: Insights into spending behavior
Real-time Updates: Live data updates without page refresh

🛠️ Technology Stack

Frontend

Framework: Next.js 14 with App Router
Language: TypeScript for type safety
Styling: Tailwind CSS for responsive design
UI Components: Radix UI for accessibility
Icons: Lucide React for consistent iconography
Forms: React Hook Form with Zod validation

Backend & APIs

Database: Appwrite for backend services
Banking API: Plaid for bank connectivity
Payment Processing: Dwolla for money transfers
Error Monitoring: Sentry for application monitoring

Development Tools

Package Manager: npm
Code Quality: ESLint for code linting
Charts: Chart.js with React wrapper
Animation: React CountUp for number animations

🚀 Quick Start

Prerequisites

Node.js 18+
npm or yarn
Plaid account (for banking integration)
Appwrite account (for backend services)
Dwolla account (for payment processing)

Installation

Clone the repository

git clone https://github.com/your-username/nu-bank.git
cd nu-bank

Install dependencies
```
npm install
```

Environment Setup

Create a .env.local file in the root directory:

# Plaid Configuration
PLAID_CLIENT_ID=your_plaid_client_id
PLAID_SECRET=your_plaid_secret
PLAID_ENV=sandbox # or development/production

# Appwrite Configuration
NEXT_PUBLIC_APPWRITE_ENDPOINT=your_appwrite_endpoint
NEXT_PUBLIC_APPWRITE_PROJECT_ID=your_appwrite_project_id
APPWRITE_API_KEY=your_appwrite_api_key

# Dwolla Configuration
DWOLLA_KEY=your_dwolla_key
DWOLLA_SECRET=your_dwolla_secret
DWOLLA_ENVIRONMENT=sandbox # or production

# Sentry Configuration
SENTRY_DSN=your_sentry_dsn
SENTRY_ORG=your_sentry_org
SENTRY_PROJECT=your_sentry_project

Run the development server
```
npm run dev
```
Open your browser

Navigate to http://localhost:3000

📁 Project Structure

Banking-system/
├── app/                          # Next.js App Router
│   ├── (auth)/                  # Authentication pages
│   ├── (root)/                  # Main application pages
│   │   ├── my-banks/           # Bank management
│   │   ├── payment-transfer/   # Payment transfer
│   │   ├── transaction-history/ # Transaction history
│   │   └── page.tsx            # Dashboard home
│   ├── api/                    # API routes
│   │   ├── bank/              # Banking operations
│   │   ├── dwolla/            # Payment processing
│   │   ├── plaid/             # Plaid integration
│   │   └── debug/             # Debug endpoints
│   ├── global-error.jsx       # Global error boundary
│   ├── layout.tsx             # Root layout
│   └── globals.css            # Global styles
├── components/                  # Reusable components
│   ├── ui/                     # Base UI components
│   ├── AuthForm.tsx           # Authentication
│   ├── BankCard.tsx           # Bank account cards
│   ├── DoughnutChart.tsx      # Data visualization
│   ├── PaymentTransferForm.tsx # Transfer interface
│   ├── RecentTransactions.tsx # Transaction display
│   ├── Sidebar.tsx            # Navigation
│   └── ...
├── lib/                        # Utility libraries
│   ├── actions/               # Server actions
│   │   ├── bank.actions.ts    # Banking operations
│   │   ├── user.actions.ts    # User management
│   │   ├── transaction.actions.ts # Transaction handling
│   │   └── dwolla.actions.ts  # Payment processing
│   ├── appwrite.ts            # Appwrite configuration
│   ├── plaid.ts               # Plaid client setup
│   └── utils.ts               # Utility functions
├── types/                      # TypeScript definitions
│   └── index.d.ts             # Type declarations
├── public/                     # Static assets
│   └── icons/                 # Application icons
├── constants/                  # Application constants
│   └── index.ts               # Configuration constants
├── package.json               # Dependencies
├── tailwind.config.ts         # Tailwind configuration
├── next.config.mjs            # Next.js configuration
└── tsconfig.json              # TypeScript configuration

🔧 Configuration

Plaid Setup

Create a Plaid account
Get your Client ID and Secret keys
Configure allowed redirect URIs
Set up webhooks for real-time updates

Appwrite Setup

Create an Appwrite project
Set up database collections for users, banks, and transactions
Configure authentication methods
Generate API keys with appropriate permissions

Dwolla Setup

Register for Dwolla
Obtain API credentials
Configure sandbox/production environments
Set up webhook endpoints

🏃‍♂️ Available Scripts

npm run dev - Start development server
npm run build - Build for production
npm run start - Start production server
npm run lint - Run ESLint

📖 API Documentation

Banking Endpoints

GET /api/bank/link-token - Create Plaid link token
POST /api/bank/add-funding-source - Add bank account
GET /api/debug/get-account - Get account details

Payment Endpoints

POST /api/dwolla/transfer-status - Check transfer status
POST /api/dwolla/poll - Poll transfer updates
POST /api/dwolla/reconcile - Reconcile transfers

Transaction Endpoints

Integrated with Plaid for real-time transaction sync
Custom transfer tracking via Appwrite

🔒 Security

Data Encryption: All sensitive data encrypted in transit and at rest
Secure Authentication: JWT-based authentication system
Bank-level Security: Industry-standard security protocols
Environment Isolation: Separate configurations for dev/staging/prod
Error Monitoring: Comprehensive error tracking and alerting

🚀 Deployment

🚀 Live Demo

👉 https://banking-system-theta-eight.vercel.app/sign-in

Vercel (Recommended)

Connect your GitHub repository to Vercel
Configure environment variables in Vercel dashboard
Deploy with automatic CI/CD

Other Platforms

The application can be deployed on any platform supporting Next.js:

Netlify
AWS Amplify
DigitalOcean App Platform
Railway

🤝 Contributing

Fork the repository
Create a feature branch (git checkout -b feature/amazing-feature)
Commit your changes (git commit -m 'Add some amazing feature')
Push to the branch (git push origin feature/amazing-feature)
Open a Pull Request

Development Guidelines

Follow TypeScript best practices
Use ESLint for code quality
Write meaningful commit messages
Add tests for new features
Update documentation as needed

📝 License

This project is licensed under the MIT License - see the LICENSE file for details.

🙏 Acknowledgments

Plaid for banking infrastructure
Appwrite for backend services
Dwolla for payment processing
Next.js team for the amazing framework
Tailwind CSS for the utility-first CSS framework

📞 Support

For support and questions:

Create an issue
Email: a.mohamed2350@nu.edu.eg
Documentation: NU Bank Final Repo.pdf

Built with ❤️ by the NU Bank Team

Name		Name	Last commit message	Last commit date
Latest commit History 108 Commits
.github/workflows		.github/workflows
app		app
components		components
constants		constants
lib		lib
public/icons		public/icons
types		types
.env		.env
.env.example		.env.example
.eslintrc.json		.eslintrc.json
.gitignore		.gitignore
LICENSE		LICENSE
NU Bank Final Repo.pdf		NU Bank Final Repo.pdf
README.md		README.md
bank.json		bank.json
components.json		components.json
next.config.mjs		next.config.mjs
package-lock.json		package-lock.json
package.json		package.json
postcss.config.mjs		postcss.config.mjs
response.json		response.json
sentry.client.config.ts		sentry.client.config.ts
sentry.edge.config.ts		sentry.edge.config.ts
sentry.server.config.ts		sentry.server.config.ts
tailwind.config.ts		tailwind.config.ts
tsconfig.json		tsconfig.json

License

BankingSystemOrg/Banking-system

Folders and files

Latest commit

History

Repository files navigation