• Coding Behind Quant Trading
    • 1. The Architecture
    • 2. What is an API?
      • 🛠️ API Playground
    • 3. Fetching and Displaying Data
    • 4. Machine Learning Integration
      • 🧠 ML Model Trainer

Game · Quant bot · Overview

Coding Behind Quant Trading

Understand how APIs, Frontend, and Backend power modern trading bots.

1. The Architecture

Our Quant Trading Bot operates on a client-server architecture:

  • Frontend (Client): The browser interface built with HTML, CSS, and JavaScript. It displays charts and controls.
  • Backend (Server): A Java Spring Boot application that crunches numbers, calculates indicators, and runs machine learning models.

2. What is an API?

API stands for Application Programming Interface. It acts as a bridge between the frontend and the backend. When you type in a stock ticker and press "Load Data", the frontend sends an HTTP GET request to the backend.

// Example API Request (Frontend)
const response = await fetch('/bank/quant/market/history?ticker=AAPL');
const data = await response.json();

The backend receives this request, fetches the stock history from its database or an external provider (like Alpha Vantage), and sends it back as JSON data.

🛠️ API Playground

Try sending a mock API request yourself!

Waiting for request...

3. Fetching and Displaying Data

Once the frontend receives the JSON data, it parses it to extract dates, open, high, low, and close prices. Then, it uses charting libraries like Plotly.js to draw candlestick charts.

4. Machine Learning Integration

For the ML models, the frontend sends the user's parameters (like lookback and horizon) via a POST request. The backend uses Python integration or Java ML libraries to train the model and return accuracy metrics and predictions.

// Example POST Request
const payload = { modelType: "random_forest", lookback: 60 };
const response = await fetch('/bank/quant/ml/train', {
  method: 'POST',
  headers: { 'Content-Type': 'application/json' },
  body: JSON.stringify(payload)
});
});

🧠 ML Model Trainer

Tweak the parameters below and train a mock model to see the results.