A comprehensive micro-banking system built with FastAPI backend and React + TypeScript frontend, featuring complete authentication, account management, and banking operations.
After running docker-compose up --build, login with these credentials:
| Role | Username | Password | Access Level | 
|---|---|---|---|
| π΄ Admin | admin | admin123 | Full system control | 
| π‘ Manager | manager1 | password123 | Branch management | 
| π’ Agent | agent1 | password123 | Customer operations | 
π Application URL: http://localhost:5173
Micro-Banking-System/
βββ Backend/                 # FastAPI backend (Python)
β   βββ main.py             # Main application entry
β   βββ auth.py             # JWT authentication
β   βββ database.py         # PostgreSQL configuration
β   βββ schemas.py          # Pydantic models
β   βββ customer.py         # Customer management
β   βββ employee.py         # Employee management
β   βββ branch.py           # Branch operations
β   βββ savingAccount.py    # Savings account handling
β   βββ transaction.py      # Transaction processing
β   βββ fixedDeposit.py     # Fixed deposit management
β   βββ jointAccounts.py    # Joint account operations
β   βββ Dockerfile          # Backend containerization
β   βββ requirement.txt     # Python dependencies
βββ Frontend/               # React + TypeScript frontend
β   βββ src/
β   β   βββ components/     # React components
β   β   βββ services/       # API service functions
β   β   βββ contexts/       # React contexts (Auth)
β   β   βββ config/         # API configuration
β   βββ Dockerfile          # Frontend containerization
β   βββ package.json
β   βββ vite.config.ts      # Vite configuration
βββ init-scripts/           # Database initialization
β   βββ 01-init-database.sql # Complete database setup
βββ docker-compose.yml      # Docker services configuration
βββ README.md              # This file
- JWT-based authentication with role-based access control
- Multi-role support: Admin, Manager, Agent
- Secure token management with automatic refresh
- Protected routes and API endpoints
- Customer Management: Registration, profile management, KYC
- Account Operations: Savings accounts, joint accounts, fixed deposits
- Transaction Processing: Deposits, withdrawals, transfers
- Branch Management: Multi-branch support with employee assignment
- Employee Management: Role-based staff management
- Backend: FastAPI, PostgreSQL, SQLAlchemy, Pydantic
- Frontend: React 18, TypeScript, Vite, Tailwind CSS
- Authentication: JWT tokens, bcrypt password hashing
- UI Components: Shadcn/ui component library
- Python 3.8+
- Node.js 16+
- PostgreSQL database
Windows (Recommended):
cd Backend
start-backend.batManual Setup:
cd Backend
python -m venv venv
venv\Scripts\activate        # Windows
source venv/bin/activate     # Linux/macOS
pip install -r requirement.txt
uvicorn main:app --reload --port 8000Backend will be available at:
- π API: http://localhost:8000
- π Interactive docs: http://localhost:8000/docs
- π ReDoc: http://localhost:8000/redoc
Windows (Recommended):
cd Frontend
start-frontend.batManual Setup:
cd Frontend
npm install
npm run devFrontend will be available at: http://localhost:5173
- Docker Desktop installed and running
- Docker Compose (included with Docker Desktop)
Run the entire application with Docker:
docker-compose up --buildThis will:
- Build and start PostgreSQL database
- Automatically initialize database schema with all tables, triggers, and views
- Insert sample data for immediate testing
- Build and start FastAPI backend
- Build and start React frontend
- Set up networking between all services
Services will be available at:
- π Frontend: http://localhost:5173
- π Backend API: http://localhost:8000
- π API Docs: http://localhost:8000/docs
- ποΈ PostgreSQL: localhost:5432
The database is automatically initialized with these test accounts:
| Role | Username | Password | Description | 
|---|---|---|---|
| Admin | admin | admin123 | Full system access, user management | 
| Manager | manager1 | password123 | Branch operations, customer management | 
| Manager | manager2 | password123 | Branch operations, customer management | 
| Agent | agent1 | password123 | Customer service, account operations | 
| Agent | agent2 | password123 | Customer service, account operations | 
π Quick Login Test:
- Go to http://localhost:5173
- Use Username: adminand Password:admin123
- Access the Admin Dashboard with full privileges
The project includes these Docker files:
version: "3.9"
services:
  backend:
    build: ./Backend
    ports:
      - "8000:8000"
    depends_on:
      - db
    environment:
      - DB_HOST=db
      - DB_PORT=5432
      - DB_NAME=B_trust
      - DB_USER=postgres
      - DB_PASSWORD=1234
  frontend:
    build: ./Frontend
    ports:
      - "5173:80"
    depends_on:
      - backend
  db:
    image: postgres:15
    environment:
      POSTGRES_USER: postgres
      POSTGRES_PASSWORD: 1234
      POSTGRES_DB: B_trust
    volumes:
      - ./init-scripts:/docker-entrypoint-initdb.d/
      - db-data:/var/lib/postgresql/data
    healthcheck:
      test: ["CMD-SHELL", "pg_isready -U postgres"]
      interval: 5s
      timeout: 5s
      retries: 5
volumes:
  db-data:- Multi-stage build for optimized image size
- Uses Python 3.11 slim base image
- Runs with Gunicorn + Uvicorn workers for production
- Includes health checks and security best practices
- Uses Node.js for building React app
- Serves with Nginx for production
- Optimized for static file serving
__pycache__/
*.pyc
*.pyo
*.log
.env
venv/
.git
Complete database initialization script that automatically creates:
- 11 Tables: All banking entities with proper relationships
- Custom Types: Employee types, account types, transaction types
- Auto-ID Triggers: Automatic ID generation for all entities
- Views & Materialized Views: Pre-built queries for reporting
- Sample Data: Ready-to-use test accounts and users
π Includes Pre-configured Login Accounts:
- Admin: admin/admin123(Full system access)
- Manager: manager1/password123(Branch management)
- Manager: manager2/password123(Branch management)
- Agent: agent1/password123(Customer service)
- Agent: agent2/password123(Customer service)
Build and start all services:
docker-compose up --buildStart services in background:
docker-compose up -dStop all services:
docker-compose downView logs:
# All services
docker-compose logs
# Specific service
docker-compose logs backend
docker-compose logs frontend
docker-compose logs dbRebuild specific service:
docker-compose build backend
docker-compose build frontendAccess service containers:
# Backend container
docker-compose exec backend bash
# Database container
docker-compose exec db psql -U postgres -d B_trust# Database configuration
DB_HOST=db
DB_PORT=5432
DB_NAME=B_trust
DB_USER=postgres
DB_PASSWORD=1234
DB_SSLMODE=disable
# JWT configuration
JWT_SECRET=your_secret_key
JWT_ALGORITHM=HS256
ACCESS_TOKEN_EXPIRE_MINUTES=30export const API_BASE_URL = 'http://localhost:8000';
export const buildApiUrl = (endpoint: string): string => {
    return `${API_BASE_URL}${endpoint}`;
};
export const getAuthHeaders = (token?: string) => ({
    'Content-Type': 'application/json',
    ...(token && { Authorization: `Bearer ${token}` }),
});Common Docker Issues:
Port conflicts:
# Check what's using ports
netstat -ano | findstr :8000
netstat -ano | findstr :5173
# Stop conflicting processes or change ports in docker-compose.ymlDatabase connection issues:
# Check if database is ready
docker-compose exec db pg_isready -U postgres
# View database logs
docker-compose logs dbBuild failures:
# Clean build (no cache)
docker-compose build --no-cache
# Remove all containers and rebuild
docker-compose down
docker system prune -f
docker-compose up --buildContainer not starting:
# Check container status
docker-compose ps
# View detailed logs
docker-compose logs --follow backendVolume issues:
# Remove volumes and restart
docker-compose down -v
docker-compose up --buildFor production deployment, consider:
- Use environment files:
docker-compose --env-file .env.prod up -d- Set production environment variables:
JWT_SECRET=super_secure_production_secret
DB_PASSWORD=strong_production_password- Use Docker secrets for sensitive data
- Set up proper logging and monitoring
- Configure reverse proxy (Nginx) for HTTPS
βββββββββββββββ    ββββββββββββββββ    ββββββββββββββββββ
β  Frontend   βββββΆβ   Backend    βββββΆβ   PostgreSQL   β
β  (React)    β    β  (FastAPI)   β    β   Database     β
β  Port: 5173 β    β  Port: 8000  β    β   Port: 5432   β
βββββββββββββββ    ββββββββββββββββ    ββββββββββββββββββ
Service startup order:
- PostgreSQL Database starts first
- Backend waits for database to be ready
- Frontend starts after backend is available
Create a .env file in the Backend directory:
SECRET_KEY=your_super_secret_jwt_key_here
ACCESS_TOKEN_EXPIRE_MINUTES=30
DATABASE_URL=postgresql://username:password@localhost:5432/micro_banking
ALGORITHM=HS256The frontend uses centralized API configuration in src/config/api.ts:
export const API_BASE_URL = 'http://localhost:8000';
export const buildApiUrl = (endpoint: string): string => {
    return `${API_BASE_URL}${endpoint}`;
};
export const getAuthHeaders = (token?: string) => ({
    'Content-Type': 'application/json',
    ...(token && { Authorization: `Bearer ${token}` }),
});All service files import these utilities for consistent API communication.
- Start both servers (Backend on :8000, Frontend on :5173)
- Open the application at http://localhost:5173
- Test authentication with default credentials:
- Admin Login: Username admin, Passwordadmin123
- Manager Login: Username manager1, Passwordpassword123
- Agent Login: Username agent1, Passwordpassword123
 
- Admin Login: Username 
- Navigate between different role dashboards
- Test logout functionality
- Test API connectivity:
- Go to Admin Dashboard β Connection Test
- Click "Test Connection" to verify backend communication
 
- System-wide management
- User and employee management
- Branch operations oversight
- Connection testing tools
- Branch-specific operations
- Customer account management
- Transaction monitoring
- Employee supervision
- Customer service operations
- Account opening and management
- Transaction processing
- Daily operational tasks
- POST /auth/token- User login
- GET /auth/users/me- Get current user
- POST /auth/user/register- Register new user
- GET /auth/protected- Test protected endpoint
- /customers/*- Customer management
- /employees/*- Employee operations
- /branches/*- Branch management
- /saving-accounts/*- Savings account operations
- /transactions/*- Transaction handling
- /fixed-deposits/*- Fixed deposit management
- /joint-accounts/*- Joint account operations
The system uses PostgreSQL with the following main entities:
- Users (Authentication)
- Customers (Bank customers)
- Employees (Bank staff)
- Branches (Bank locations)
- Accounts (Savings, Joint, Fixed Deposits)
- Transactions (All financial operations)
Backend Issues:
- β Port 8000 in use: Change port in startup script or kill existing process
- β Database connection failed: Verify PostgreSQL is running and credentials are correct
- β Module not found: Ensure virtual environment is activated and dependencies installed
Frontend Issues:
- β CORS errors: Backend has CORS middleware configured for localhost:5173
- β API connection failed: Verify backend is running on port 8000
- β Build errors: Check Node.js version and clear node_modules if needed
Authentication Issues:
- β Login fails: Check backend logs for detailed error messages
- β Token expired: Logout and login again, check token expiry settings
- β Unauthorized: Verify user credentials and role permissions
- π Integration Guide - Detailed setup and integration instructions
- π API Integration - Frontend API integration details
- π Database Queries - SQL schema and queries
- π Database Views - Database view definitions
- JWT Authentication with configurable expiry
- Password Hashing using bcrypt
- Role-based Access Control (RBAC)
- CORS Protection for cross-origin requests
- Input Validation using Pydantic schemas
- SQL Injection Protection via SQLAlchemy ORM
- Backend Framework: FastAPI (async Python web framework)
- Database: PostgreSQL with SQLAlchemy ORM
- Frontend Framework: React 18 with TypeScript
- Build Tool: Vite for fast development and building
- Styling: Tailwind CSS with Shadcn/ui components
- State Management: React Context API
- HTTP Client: Fetch API with custom service layer
βββ Backend/           # Python FastAPI application
βββ Frontend/          # React TypeScript application  
βββ INTEGRATION_GUIDE.md   # Setup and integration guide
βββ README.md         # This file
- Fork the repository
- Create a feature branch (git checkout -b feature/amazing-feature)
- Commit your changes (git commit -m 'Add amazing feature')
- Push to the branch (git push origin feature/amazing-feature)
- Open a Pull Request
This project is licensed under the MIT License - see the LICENSE file for details.
- FastAPI for the excellent async web framework
- React team for the powerful frontend library
- Shadcn for the beautiful UI components
- The open-source community for amazing tools and libraries
π¦ Ready to revolutionize micro-banking? Get started now!