Stochastix UI

Stochastix UI is the official frontend for the Stochastix quantitative trading backtesting framework. It is a modern, fully-featured Single Page Application (SPA) built with Nuxt 3, providing a rich, interactive graphical user interface to configure, launch, and analyze backtesting results generated by the core engine.

This application is designed to run locally, communicating with a running instance of the stochastix-core backend via its REST API.

Features

• Dynamic Backtest Configuration: Launch new backtests by selecting from available strategies and configuring their unique parameters through a dynamically generated form.
• Comprehensive Results Visualization: Dive deep into backtest performance with detailed reports and visualizations.
  • Performance Summaries: At-a-glance overview of key metrics like PnL, win rate, and total trades.
  • Detailed Statistics: In-depth tables for pair-by-pair performance, entry/exit tag analysis, and a full breakdown of over 20 summary metrics (Sharpe, Sortino, Drawdown, etc.).
  • Visual Analysis Plots: Interactive charts for Equity/Drawdown curves, and rolling Alpha/Beta plots against the benchmark.
  • Interactive Candlestick Charts: Visualize trades and open positions directly on the price chart, complete with overlay and pane-based indicators.
  • Full Trade History: A complete log of all closed and open positions for granular review.
• Real-Time Progress: Monitor backtest and data download progress in real-time with progress bars connected to the backend via Mercure streams.
• Data Management:
  • Local Data Overview: View all locally available market data, sorted by symbol and timeframe.
  • Data Downloader: An interface to queue new market data downloads from supported exchanges, with sequential processing to respect rate limits.
  • Dataset Inspector: Validate data integrity by inspecting files for gaps, duplicates, or out-of-order records, and view file metadata and data samples.
• Responsive Design: A clean, modern UI that works seamlessly on both desktop and mobile devices.

Documentation

For the latest official documentation, visit the Stochastix Documentation.

Tech Stack

• Framework: Nuxt 3
• Language: TypeScript
• UI Library: Nuxt UI
• State Management: Pinia
• Charting: TradingView Lightweight Charts
• Validation: Zod
• Internationalization: @nuxtjs/i18n
• Icons: @nuxt/icon

Prerequisites

1. Node.js: Version 24 or higher.
2. Stochastix Core Backend: A running instance of the stochastix-core application is required for the UI to function.

Installation

1. Clone the repository:

   git clone https://github.com/phpquant/stochastix-ui.git
   cd stochastix-ui

2. Install the dependencies:

   npm install

Configuration

The Nuxt UI needs to know the location of the stochastix-core API. This is configured via an environment variable.

Create a .env file in the root of the project:

# Example: If your backend is running on http://localhost:8000
NUXT_API_BASE_SERVER=http://localhost:8000

When using the provided Docker setup, this variable is automatically set in the compose.yaml file to point to the php service container.

Development

To start the development server with hot-reloading on http://localhost:3000:

npm run dev

The application will proxy API requests from /api to the backend URL specified in NUXT_API_BASE_SERVER.

Production

To build the application for production:

npm run generate

To preview the production build locally:

npx serve ./output/public

For more information, see the Nuxt Deployment Documentation.