💠 FinTech Nexus

A unified crypto + fiat wallet — instant payments, investing, banking & KYC in one premium dashboard.

🔒 Sandbox demo — no real money ever moves.

---

🔗 Live Demo

Surface	URL
Frontend	https://fin-tech-nexus.vercel.app/
Backend	https://fintech-nexus-backend.onrender.com/

Demo login: demo@fintechnexus.app / demo1234

📸 Screenshots

Landing	Dashboard

Crypto	Transactions

Payments	Bank & KYC

---

✨ Features

• Unified wallet — fiat balance + crypto portfolio in one net-worth view.
• Instant payments (demo) — send money, request money, and a scannable payment QR.
• Transactions — add, search, filter by type/category, delete, and export to CSV.
• Crypto tracker — price cards, 24h change, sparklines, portfolio allocation, watchlist, risk disclaimer. Live-API-ready with a graceful mock fallback.
• Bank & KYC — mock bank linking, KYC progress ring, security checklist.
• Profile — editable details, preferred currency, linked UPI ID & wallet address.
• Premium UX — glassmorphism dark UI, skeleton loaders, toast notifications, empty states, error boundary, responsive mobile-first layout, protected routes.
• Runs with zero external services — no MongoDB or API keys needed for the demo (in-memory store auto-seeds).

🧱 Tech Stack

Frontend: React 18, Vite 5, Tailwind CSS, React Router 6, Axios, Recharts, qrcode.react, react-hot-toast, react-icons.

Backend: Node.js, Express 4, JWT (jsonwebtoken), bcryptjs, Mongoose 8 (optional), Helmet, CORS, express-rate-limit, Morgan, dotenv.

Database: MongoDB Atlas (optional) — falls back to an in-memory demo store.

🏗️ Architecture

FinTech-Nexus/
├── backend/                  # Express API (sandbox demo mode)
│   ├── src/
│   │   ├── config/           # env + resilient DB connector
│   │   ├── data/             # in-memory store, dual-mode repositories, seed
│   │   ├── models/           # Mongoose schemas (used when MONGODB_URI is set)
│   │   ├── middleware/       # auth (JWT), validation, error handling
│   │   ├── controllers/      # auth, transactions, payments, bank/kyc, crypto, overview
│   │   ├── services/         # crypto market service (live or mock)
│   │   ├── routes/           # /api router
│   │   ├── app.js            # express app (helmet, cors, rate-limit, health)
│   │   └── index.js          # server bootstrap
│   ├── .env.example
│   └── render.yaml
└── client/                   # React + Vite SPA
    ├── src/
    │   ├── context/          # AuthContext (JWT in localStorage)
    │   ├── lib/              # axios client, formatters
    │   ├── components/       # layout, UI primitives, skeletons, guards
    │   └── pages/            # Landing, Login, Register, Dashboard, Transactions,
    │                         #   Payments, Crypto, Kyc, Profile, NotFound
    ├── .env.example
    └── vercel.json

Data layer: controllers talk to a repository abstraction. When MONGODB_URI is present and connects, it uses Mongoose; otherwise it uses an in-memory store seeded with a demo user. The app never crashes when the database is unavailable — it logs a clear message and continues in demo mode.

🚀 Local Setup

Prerequisites: Node.js 18+ and npm.

# 1. Clone
git clone https://github.com/0xSHSH/FinTech-Nexus.git
cd FinTech-Nexus

# 2. Backend
cd backend
cp .env.example .env          # optional — defaults work for the demo
npm install
npm run dev                   # http://localhost:5550  (health: /health)

# 3. Frontend (new terminal)
cd ../client
cp .env.example .env          # VITE_API_URL=http://localhost:5550/api
npm install
npm run dev                   # http://localhost:5173

Open http://localhost:5173 and sign in with the demo credentials. No database required.

🔐 Environment Variables

Backend (backend/.env)

Variable	Required	Description
PORT	no	API port (default 5550).
NODE_ENV	no	development / production.
JWT_SECRET	prod only	JWT signing secret. Dev auto-generates an ephemeral one.
JWT_EXPIRES_IN	no	Token lifetime (default 7d).
CLIENT_ORIGIN	no	Comma-separated allowed CORS origins (default http://localhost:5173).
MONGODB_URI	no	MongoDB connection string. Blank → in-memory demo mode.
CRYPTO_API_URL	no	Custom market-data provider. Blank → realistic mock data.

Frontend (client/.env)

Variable	Required	Description
VITE_API_URL	yes	Backend base URL, e.g. http://localhost:5550/api.

🛣️ Backend Routes

Method	Endpoint	Auth	Description
GET	/health	–	Health check + current mode.
POST	/api/auth/register	–	Create account → { token, user }.
POST	/api/auth/login	–	Login → { token, user }.
GET	/api/auth/me	✅	Current user.
PATCH	/api/auth/profile	✅	Update profile fields.
GET	/api/overview	✅	Aggregated dashboard payload.
GET	/api/transactions	✅	List + filter (type, category, search) + summary.
POST	/api/transactions	✅	Add a transaction.
DELETE	/api/transactions/:id	✅	Delete a transaction.
GET	/api/payments	✅	Transfers + money requests.
POST	/api/payments/send	✅	Demo send money.
POST	/api/payments/request	✅	Demo request money.
GET	/api/bank	✅	Linked bank account.
POST	/api/bank/link	✅	Demo link a bank account.
GET	/api/kyc	✅	KYC status + checklist.
POST	/api/kyc/submit	✅	Demo instant KYC verification.
GET	/api/crypto/market	–	Market data (live or mock).
GET	/api/crypto/portfolio	✅	Portfolio + allocation.

☁️ Deployment Guide

Full step-by-step in DEPLOYMENT.md. Summary:

• Backend → Render (or Railway): root backend/, build npm install, start npm start, health /health. Set JWT_SECRET, CLIENT_ORIGIN, and optionally MONGODB_URI. A render.yaml blueprint is included.
• Frontend → Vercel: root client/, framework Vite, set VITE_API_URL to your Render URL. SPA rewrites are handled by vercel.json.
• Database → MongoDB Atlas (optional): create a free cluster, whitelist 0.0.0.0/0, paste the URI into MONGODB_URI, run npm run seed.

🛡️ Security Notes

• No hardcoded secrets. All credentials come from environment variables; .env is git-ignored and .env.example documents every key.
• Passwords are hashed with bcrypt; password hashes are never returned by the API.
• Sessions use signed JWT tokens; JWT_SECRET is mandatory in production (the server refuses to boot with an insecure default).
• Hardening: Helmet headers, env-based CORS allow-list, and API rate limiting.
• Sandbox only. Every financial action (send/request money, bank linking, KYC) is simulated — no real money or real banking/crypto APIs are involved. The UI labels demo flows clearly.
• Treat this as a portfolio/demo project, not a production financial service.

👤 Demo Credentials

Email:    demo@fintechnexus.app
Password: demo1234

🔮 Future Improvements

• Real provider integrations behind feature flags (CoinGecko, Plaid/UPI sandboxes).
• Recurring transactions & budgets; CSV/PDF statements.
• 2FA, refresh tokens, and httpOnly cookie sessions.
• WebSocket live price streaming.
• Unit/integration tests (Vitest + Supertest) and CI.
• Multi-currency FX conversion and notifications.

License

MIT — see headers. Built for demonstration purposes.