Stock Bot Web Dashboard

A modern React web dashboard for the Stock Bot trading system.

Features

Modern UI: Built with React 18 and TypeScript
Tailwind CSS: For beautiful, responsive styling
Headless UI: Accessible components for dialogs and interactions
Heroicons: Beautiful SVG icons
Responsive Design: Works on desktop and mobile
Side Navigation: Clean navigation with mobile-responsive sidebar

Tech Stack

React 18 with TypeScript
Vite for fast development and building
Tailwind CSS for styling
Headless UI for accessible components
Heroicons for icons
Bun for package management

Getting Started

Prerequisites

Bun (for package management)
Node.js 18+

Installation

# Install dependencies
bun install

# Start development server
bun run dev

# Build for production
bun run build

# Preview production build
bun run preview

Available Scripts

bun run dev - Start development server
bun run build - Build for production
bun run preview - Preview production build
bun run lint - Run ESLint
bun run type-check - Run TypeScript type checking

Project Structure

src/
├── App.tsx           # Main app component with sidebar navigation
├── main.tsx          # React app entry point
└── index.css         # Global styles with Tailwind directives

Dashboard Features

The dashboard includes:

Responsive Sidebar: Navigation that works on desktop and mobile
Dashboard Overview: Portfolio value, returns, and active strategies
Navigation Sections:
- Dashboard (current page)
- Portfolio
- Analytics
- Reports
- Settings

Development

The app is set up with:

TypeScript for type safety
ESLint for code quality
Tailwind CSS for utility-first styling
Headless UI for accessible components
Hot module replacement for fast development

Integration

This web app is part of the larger Stock Bot system and will integrate with:

Data Service (for market data)
Portfolio Service (for portfolio management)
Strategy Service (for trading strategies)
Execution Service (for trade execution)

The web dashboard will communicate with these services via REST APIs to provide a complete trading dashboard experience.

2.3 KiB Raw Blame History