📊 Backtest Dashboard

Backtest Dashboard is a desktop application built with Next.js, TypeScript, and Electron. It provides a modern interface for managing and visualizing backtests in real time, connecting directly to the Backtester-py backend via WebSockets.

This app combines the performance of a web framework with the convenience of a native desktop experience, offering interactive charts, live updates, and configuration management for quantitative analysis workflows.

It also integrates directly with the Backtest Results to display stored results and visual summaries inside the app.

🧰 Tech Stack

• Framework: Next.js 15 (TypeScript)
• Desktop Wrapper: Electron + Electron Builder
• UI: TailwindCSS, Radix UI, Lucide Icons
• Charts: Recharts, Lightweight Charts
• State & Logic: Custom React Hooks
• Communication: WebSocket (real-time sync with FastAPI backend)

✨ Features

• ⚡ Real-time Monitoring: Follow backtest progress and metrics live.
• 📈 Dynamic Charts: Visualize performance with interactive graphs.
• ⚙️ YAML Editor: Modify configurations directly from the dashboard.
• 🧩 Walk-forward Integration: Seamless integration with backend optimizer.
• 💻 Electron Desktop Build: Run as a standalone cross-platform app.
• 🪶 Clean UI/UX: Modern design powered by Radix UI components.

🎈 Configurable parameters

👻 Results integration

🚀 Getting Started

Prerequisites

• Node.js 16+ and npm
• The Backtester-py backend running on localhost:8000

1. Clone the Repository

git clone https://github.com/jabifx/Backtest-dashboard.git
cd Backtest-dashboard

2. Install Dependencies

npm install

3. Run in Development Mode

npm run dev

4. Start in Electron Development Mode

npm run electron-dev

5. Build the Production App

npm run build-electron

Note: Ensure the Backtester-py backend is running on localhost:8000 before launching the dashboard.

📜 License

This project is licensed under the MIT License. See the LICENSE file for details.