Skip to content

Latest commit

 

History

History
102 lines (77 loc) · 3.63 KB

README.md

File metadata and controls

102 lines (77 loc) · 3.63 KB

<<<<<<< HEAD

CodeTrackPro

=======

CodeTrackPro - Futuristic Coding Dashboard

A visually stunning, AI-powered coding profile aggregator inspired by Codolio with dynamic charts, multi-platform tracking, and intelligent recommendations.

🚀 Features

  • AI Chat Master Bot: Personalized coding recommendations and performance analysis
  • Dynamic Analytics: Beautiful Chart.js visualizations for progress tracking
  • Multi-Platform Integration: Support for LeetCode, Codeforces, HackerRank, and more
  • Global Leaderboard: Compete with developers worldwide
  • Event Tracker: Never miss contests and coding events
  • Achievement Timeline: Visual timeline of your coding journey
  • Futuristic UI: Sleek design with animations and particle effects

📁 Project Structure

CodeTrackPro/
├── index.html          # Landing page with features overview
├── dashboard.html      # Main dashboard with all functionality
├── main.html          # Redirect to landing page (legacy)
├── css/
│   └── styles.css     # Custom styles and animations
└── js/
    ├── app.js         # Core application logic
    ├── charts.js      # Chart.js configurations and management
    ├── animations.js  # Particle effects and animations
    ├── ai-features.js # AI chat functionality
    ├── data.js        # Data management and storage
    └── init.js        # App initialization and utilities

🎯 Getting Started

  1. Open Landing Page: Start with index.html for an overview
  2. Launch Dashboard: Click "Launch Dashboard" or open dashboard.html directly
  3. Explore Features: Navigate through different sections using the sidebar

🎨 Design Features

  • Orbitron Font: Futuristic typography
  • Gradient Animations: Smooth color transitions
  • Particle Effects: Interactive background elements
  • Responsive Design: Works on all device sizes
  • Dark Theme: Eye-soothing color scheme

🛠 Technologies Used

  • HTML5: Semantic markup
  • Vanilla JavaScript: No framework dependencies
  • Tailwind CSS: Utility-first CSS framework
  • Chart.js: Dynamic chart rendering
  • CSS3: Custom animations and effects

🔧 Customization

  • Colors: Modify gradient colors in CSS variables
  • Data: Update sample data in js/data.js
  • Charts: Configure chart options in js/charts.js
  • AI Responses: Customize bot responses in js/ai-features.js

📈 Chart Types

  • Progress Chart: Weekly coding activity
  • Difficulty Distribution: Problem difficulty breakdown
  • Platform Performance: Multi-platform statistics
  • Rating History: Contest rating over time

🤖 AI Features

  • Smart Recommendations: Algorithm-based problem suggestions
  • Performance Analysis: Weakness identification
  • Study Plans: Personalized learning paths
  • Contest Preparation: Targeted practice recommendations

🎮 Interactive Elements

  • Platform Switching: Dynamic data filtering
  • Theme Toggle: Light/dark mode support
  • Export Functionality: Data download capabilities
  • Real-time Updates: Live performance tracking

📱 Responsive Design

  • Mobile-First: Optimized for mobile devices
  • Tablet Support: Adapted layouts for tablets
  • Desktop Enhanced: Full-featured desktop experience

🎪 Animations

  • Floating Elements: Smooth hover effects
  • Particle System: Dynamic background particles
  • Counter Animations: Number counting effects
  • Smooth Scrolling: Seamless navigation

CodeTrackPro - Master Your Coding Journey with AI-Powered Insights! 🚀

14b235f (project CodeTrackPro)