Revolutionizing digital banking with seamless payments, intelligent analytics, and enterprise-grade security
Traditional banking systems suffer from:
- Fragmented Payment Methods - Users juggle multiple apps for different payment types
- Poor User Experience - Complex interfaces and lengthy transaction processes
- Limited Analytics - Lack of actionable insights for financial decisions
- Security Concerns - Vulnerable authentication and transaction systems
- Integration Challenges - Difficulty connecting various financial services
UniPay is a comprehensive digital banking platform that unifies all payment methods into one intelligent interface, providing:
✅ Unified Payment Gateway - UPI, Net Banking, Credit/Debit Cards, E-wallets in one platform
✅ AI-Powered Analytics - Smart financial insights and spending patterns
✅ Enterprise Security - Multi-factor authentication with OTP verification
✅ Real-time Processing - Instant transactions with live status updates
✅ Responsive Design - Seamless experience across all devices
- Multi-Factor Authentication with Twilio SMS OTP
- Secure Session Management with JWT tokens
- KYC Document Upload with file validation
- Role-based Access Control for different user types
- UPI Payments - Instant money transfers
- Net Banking - Direct bank account integration
- Credit/Debit Cards - Secure card processing via Stripe
- E-Wallets - Popular wallet integrations
- E-Commerce Payments - Online shopping checkout
- Real-time Transaction Monitoring
- Spending Pattern Analysis with interactive charts
- Monthly/Yearly Financial Reports
- Budget Tracking with smart notifications
- Export to PDF/Excel for record keeping
- Smart Chatbot for customer support
- Fraud Detection using ML algorithms
- Personalized Recommendations based on spending habits
- Predictive Analytics for financial planning
- Responsive Mobile-First Design
- Dark/Light Theme Toggle
- Progressive Web App (PWA) capabilities
- Offline Transaction Queue
- Push Notifications for important updates
graph TB
A[React Frontend] --> B[Express.js Backend]
B --> C[Stripe Payment Gateway]
B --> D[Twilio SMS Service]
B --> E[Firebase Storage]
A --> F[Recharts Analytics]
A --> G[Tailwind CSS UI]
B --> H[Multer File Upload]
Frontend:
- ⚛️ React 18 with TypeScript for type safety
- 🎨 Tailwind CSS + shadcn/ui for modern UI components
- 📊 Recharts for beautiful data visualizations
- 🔄 React Query for efficient data fetching
- 🧩 React Router for seamless navigation
Backend:
- 🟢 Node.js + Express.js for robust API development
- 💳 Stripe for secure payment processing
- 📱 Twilio for SMS OTP verification
- 📁 Multer for file upload handling
- 🔒 JWT for authentication tokens
Database & Storage:
- 🔥 Firebase for real-time data sync
- 📦 Local Storage for offline capabilities
- 💾 In-memory OTP store for security
- Node.js 18.x or higher
- npm or yarn package manager
- Stripe account for payments
- Twilio account for SMS
- Firebase project setup
git clone https://github.com/yourusername/unipay.git
cd unipaycd backend
npm install
# Create .env file
cp .env.example .envConfigure Environment Variables:
# Twilio Configuration
TWILIO_ACCOUNT_SID=your_twilio_account_sid
TWILIO_AUTH_TOKEN=your_twilio_auth_token
TWILIO_PHONE_NUMBER=your_twilio_phone_number
# Stripe Configuration
STRIPE_SECRET_KEY=your_stripe_secret_key
STRIPE_PUBLISHABLE_KEY=your_stripe_publishable_key
# Application Settings
PORT=5000
FRONTEND_URL=http://localhost:3000
NODE_ENV=developmentcd ../CITI-Bank-main-UniPay-main
npm install
# Start development server
npm run dev# Terminal 1 - Backend
cd backend && npm start
# Terminal 2 - Frontend
cd CITI-Bank-main-UniPay-main && npm run dev- Frontend: http://localhost:3000
- Backend API: http://localhost:5000
- Stripe Server: http://localhost:5050
POST /api/send-otp
Content-Type: application/json
{
"mobile": "9876543210"
}POST /api/verify-otp
Content-Type: application/json
{
"mobile": "9876543210",
"otp": "123456"
}POST /create-checkout-session
Content-Type: application/json
{
"amount": 1000
}POST /upload-kyc
Content-Type: multipart/form-data
{
"kycFile": [FILE]
}- Enter mobile number for OTP-based authentication
- Upload KYC documents for account verification
- Complete profile setup with personal details
- Select payment method (UPI/Cards/Net Banking)
- Enter recipient details and amount
- Confirm transaction with secure authentication
- Receive real-time payment confirmation
- View spending patterns with interactive charts
- Monitor account balance across multiple accounts
- Track monthly budgets and savings goals
- Export transaction history as PDF reports
- Add frequent payees for quick transfers
- Organize beneficiaries by categories
- Set transfer limits for enhanced security
npm run testnpm run test:integrationnpm run test:e2enpm run test:performance# Build and run with Docker Compose
docker-compose up --build
# Access application at http://localhost:3000# Install Vercel CLI
npm i -g vercel
# Deploy frontend
cd CITI-Bank-main-UniPay-main
vercel --prod# Login to Heroku
heroku login
# Create new app
heroku create unipay-backend
# Deploy
git push heroku main- 🔐 End-to-End Encryption for all sensitive data
- 🛡️ CORS Protection against cross-origin attacks
- ⚡ Rate Limiting to prevent API abuse
- 🔍 Input Validation with comprehensive sanitization
- 📱 OTP Verification with time-based expiration
- 🗂️ Secure File Upload with type validation
- 🔑 JWT Authentication with refresh tokens
- ⚡ Page Load Time: < 2.5 seconds
- 🚀 API Response Time: < 200ms average
- 📱 Mobile Performance: 95+ Lighthouse score
- 🌐 Browser Support: Chrome, Firefox, Safari, Edge
- 📊 Uptime: 99.9% availability guaranteed
We welcome contributions! Please see our Contributing Guidelines for details.
- Fork the repository
- Create feature branch (
git checkout -b feature/amazing-feature) - Commit changes (
git commit -m 'Add amazing feature') - Push to branch (
git push origin feature/amazing-feature) - Open Pull Request
- 🏅 Runners Up - Citi Campus Innovation Challenge (CCIC) Hackathon 5.0, 2025