📈 StockApp - Full-Stack Stock Market Application

A modern, production-ready full-stack application for stock market data management with a beautiful React frontend and comprehensive Django REST API backend.

🛠️ Tech Stack Badges

🏗️ Project Overview

This is a full-stack application featuring a React TypeScript frontend with a Django REST API backend, including:

• Stock Trading Platform - Buy/sell orders, portfolio management, real-time data
• Stock Analysis - Technical indicators, chart patterns, historical data
• Automated Trading Bots - Create and manage trading bots with isolated portfolios, cash management, and signal persistence
• User Management - Authentication, profiles, settings, support requests
• Order Management - Market and target orders with automatic execution
• Portfolio Tracking - Real-time portfolio value, gain/loss tracking
• Bot Simulation System - Multi-bot grid search simulations with comprehensive parameter testing

🎨 Frontend Features

• Modern React UI with TypeScript and Tailwind CSS
• Perplexity-Style Animated Background with floating orbs and gradients
• Glass-Morphism Design with beautiful visual effects
• Complete Authentication System (Login/Register/Profile Management)
• Portfolio Management - View holdings, place orders, track performance
• Order Management - Create, execute, and track buy/sell orders
• Trading Bots - Create, configure, and manage automated trading bots with isolated portfolios
• Bot Portfolio Management - Track bot-specific holdings with HIFO sell logic and lot tracking
• Signal Persistence - Configure bots to require signal confirmation before execution
• Settings Page - Comprehensive trading preferences and platform settings
• Contact Support - Submit support requests with error tracking
• PDF Export - Export portfolio and orders data as PDFs
• Responsive Design optimized for all devices
• Smooth Animations with Framer Motion
• Form Validation with React Hook Form and Zod
• Pagination - Efficient handling of large datasets with server-side pagination

🔧 Backend Features

• Custom User Management System with email-based authentication
• RESTful API with comprehensive endpoints
• Stock Data Management - Historical prices, intraday data, real-time quotes
• Order Execution System - Automatic order execution with error handling
• Portfolio Management - Cash balance, holdings, weighted average pricing
• Trading Bot Engine - Automated trading with ML models, indicators, patterns, and signal aggregation
• Bot Portfolio System - Isolated bot portfolios with HIFO sell logic and lot tracking
• Risk Management - Position sizing, cash alignment, and risk-based trade validation
• Signal Persistence - Configurable signal confirmation before trade execution
• Bot Simulation Framework - Multi-bot grid search with parameter optimization
• Support Request System - User support ticket management
• Multi-Environment Docker Setup (Development, Staging, Production, Testing)
• Modern Code Quality Tools (Ruff for linting and formatting)
• Production-Ready Configuration with security best practices
• Comprehensive Documentation and setup guides

📸 Screenshots

Dashboard

The main dashboard provides a comprehensive overview of your trading activity. It displays your portfolio summary with total value, gains/losses, and cash balance. The watchlist section shows your tracked stocks with real-time price updates. Market summary widgets highlight top gainers, losers, and most active stocks. Quick navigation cards allow easy access to key features like portfolio management, stock browsing, and order placement.

Stocks Page

The stocks page is your gateway to exploring the stock market. Browse through an extensive list of stocks with advanced search and filtering capabilities by exchange, sector, or company name. Each stock card displays key information including current price, market cap, volume, and price change. Interactive elements allow you to quickly add stocks to your watchlist or navigate to detailed stock analysis pages. The responsive grid layout adapts beautifully to any screen size.

Stock Details Page

The stock details page provides in-depth analysis for individual stocks. Features include interactive price charts with multiple time intervals (1m, 5m, 15m, 30m, 1h, 1d), real-time price quotes with bid/ask spreads, market depth visualization showing order book levels, and volume analysis. Historical price data is displayed with OHLCV (Open, High, Low, Close, Volume) information. You can add the stock to your watchlist, set price alerts, and view comprehensive company information all in one place.

Indicators Page

The indicators page showcases technical analysis tools for stock evaluation. Browse through various technical indicators such as Moving Averages (MA, EMA, SMA), Relative Strength Index (RSI), MACD, Bollinger Bands, and more. Each indicator includes detailed explanations, calculation methods, and interpretation guidelines. Select any indicator to view detailed analysis, historical performance, and how to use it in your trading strategy. This page helps traders make informed decisions based on technical analysis.

Patterns Page

The patterns page displays chart patterns that can help identify potential trading opportunities. Explore common patterns like Head and Shoulders, Double Tops/Bottoms, Triangles, Flags, and Pennants. Each pattern includes visual examples, formation criteria, and trading implications. Click on any pattern to see detailed explanations, historical examples, and how to identify these patterns in real market data. This resource is essential for pattern-based trading strategies.

Portfolio Page

The portfolio page is your complete trading command center. View all your holdings with detailed information including purchase price, current value, gain/loss percentages, and weighted average cost. Manage your orders with a comprehensive order history showing executed, pending, and cancelled orders. Place new buy or sell orders directly from this page. Track your portfolio performance over time with visual charts. Export your portfolio and order data as PDFs for record-keeping. The page also displays your cash balance and available funds for trading.

Settings Page

The settings page allows you to customize your trading experience and platform preferences. Configure trading preferences including default order types, position sizing, and risk management parameters. Set up notification preferences for price alerts, order executions, and market updates. Customize display options such as chart themes, data refresh intervals, and default timeframes. Manage your account security settings, API keys, and data export preferences. All settings are automatically saved and synced across your devices.

Profile Page

The profile page lets you manage your personal account information. Update your personal details including name, email, and contact information. Upload and manage your profile avatar with image cropping and preview. Change your password and manage security settings. View your account statistics including registration date, total trades, and account activity. Access account verification status and subscription information. This page ensures you have full control over your account settings and personal information.

Trading Bots Page

The trading bots page is your command center for automated trading. Create, manage, and monitor multiple trading bots with isolated portfolios and cash management. Each bot operates independently with its own cash balance and stock holdings. The page features pagination to handle large numbers of bots efficiently. View bot status (Active/Inactive), risk metrics, total equity, and quick actions like activate/deactivate, execute, and view details. The responsive grid layout displays all your bots with key metrics at a glance. Click on any bot to view comprehensive details including portfolio holdings, execution history, performance metrics, and signal analysis.

Bot Details & Portfolio Management

The bot details page provides comprehensive insights into each trading bot's performance and configuration. The Portfolio tab shows the bot's isolated holdings with detailed lot tracking using HIFO (Highest-In-First-Out) sell logic. View cash balance, portfolio value, total equity, and gain/loss calculations. Each stock holding displays individual purchase lots with purchase prices, dates, and remaining quantities. The Overview tab shows bot configuration including signal persistence settings, risk parameters, and assigned stocks. The Executions, Performance, Signals, and Orders tabs provide detailed analytics for bot activity. All tabs are accessible from both the modal quick view and the full details page for consistent user experience.

Bot Creation & Configuration

The bot creation form allows you to configure sophisticated trading bots with comprehensive settings. Assign both cash and portfolio positions simultaneously to give your bot starting capital. Configure signal persistence to require signals to persist for a specified number of ticks or time duration before execution. Set risk management parameters including risk per trade, stop loss, take profit, and position sizing limits. Select from a wide range of technical indicators and chart patterns. Configure ML model weights, signal aggregation methods, and buy/sell rules. The form includes real-time validation to ensure at least cash or portfolio is assigned, and provides helpful tooltips explaining each configuration option.

🛠️ Tech Stack

Frontend

• React 19