Skip to main content

Documentation Index

Fetch the complete documentation index at: https://mintlify.com/theonetrade/backtest-kit/llms.txt

Use this file to discover all available pages before exploring further.

The @backtest-kit/ui package is a full-stack UI framework for visualizing cryptocurrency trading signals, backtests, and real-time market data. It combines a Node.js backend server with a React frontend dashboard — both delivered from a single npm package. Instead of building custom monitoring dashboards, @backtest-kit/ui gives you a complete visualization layer out of the box, covering everything from candlestick charts and signal tracking to risk rejections and trailing stop events.

​
Key Features

Interactive Charts

Candlestick visualization powered by Lightweight Charts across 1m, 15m, and 1h timeframes. Each signal view includes a full multi-timeframe chart.

Signal Tracking

Browse opened, closed, scheduled, and cancelled signals with complete detail forms — including entry price, TP/SL levels, and timestamps.

Risk Analysis

Monitor risk rule rejections in real time. See exactly which validation fired and why a pending signal was blocked.

Notifications

Real-time notification system for all trading events — signal opens, closes, partial profits, and errors surface immediately.

Trailing & Breakeven

Visualize trailing stop, trailing take-profit, and breakeven adjustment events overlaid directly on the candlestick chart.

Material Design

Clean interface built with MUI 5 and Mantine components. Each signal includes a JSON export for raw data access.
@backtest-kit/ui is a full-stack package — it ships a Node.js backend alongside the React frontend. There is no separate server to configure or deploy. The backend and frontend start together from a single entry point.

​
Getting Started

1

Install the package and its peers

npm install @backtest-kit/ui backtest-kit ccxt
2

Launch with the CLI

If you are using @backtest-kit/cli, add the --ui flag to any mode and the dashboard starts automatically:
npm start -- --backtest --ui
npm start -- --live --ui
The CLI handles wiring the backend to your strategy’s event stream — no additional code is required.
3

Open the dashboard

Navigate to http://localhost:8080 (or the port shown in the console). The dashboard connects automatically and begins streaming events from your running strategy.

​
Launching with the CLI

The easiest way to use @backtest-kit/ui is through the --ui flag on @backtest-kit/cli. Pass it alongside any execution mode: 
# Backtest with dashboard
npx @backtest-kit/cli --backtest --ui

# Paper trading with dashboard
npx @backtest-kit/cli --paper --ui

# Live trading with dashboard
npx @backtest-kit/cli --live --ui
The CLI automatically starts the Node.js backend, subscribes it to the strategy’s event bus, and serves the React dashboard — all without any configuration.

​
What You Can Monitor

The dashboard surfaces every event that backtest-kit emits:
ViewWhat It Shows
SignalsFull list of all signals with status, entry/exit prices, and PNL
ChartsMulti-timeframe candlestick chart with overlaid signal markers
Risk LogEvery risk rejection with the rule name and rejection reason
NotificationsLive feed of all system events in chronological order
Trailing EventsStop-loss and take-profit adjustment history per position
Each signal entry in the dashboard includes a JSON export button. Use it to inspect the raw signal payload, including all fields passed to addStrategySchema, for debugging or reporting.

Build docs developers (and LLMs) love

Get started for freeTalk to us