⚡ CODE STRIKE

🌍 PLAY CODE STRIKE LIVE HERE

Code Strike is a high-octane, 1v1 real-time competitive programming platform heavily inspired by the aesthetics and energy of Dragon Ball Z.

🐉 The Problem & The Solution

The Problem: Traditional algorithm practice (like LeetCode or Codeforces) is a solitary, quiet, and often grueling experience. It lacks adrenaline, making coder burnout incredibly common.

The Solution: Code Strike transforms algorithmic problem-solving into a high-stakes martial arts tournament. By combining real-time WebSockets, dynamic Elo matchmaking, and a cinematic, gamified UI, developers can test their logic against real opponents under intense time pressure. It makes getting better at algorithms fun.

---

📸 Platform Gallery

The Gateway (Login)	Command Center (Dashboard)

Hall of Legends (Leaderboard)	Hyperbolic Time Chamber

The Battlefield (Arena)	Live Code Execution

---

🚀 Core Features & Architecture

⚔️ The Matchmaking Engine

Instead of basic queuing, Code Strike uses a highly engineered Background Tick Loop that processes the queue every 2 seconds:

• Expanding Search Radius: Prevents infinite queue times.
  • 0-10s: Strict pairing (± 200 Elo).
  • 10-20s: Moderate expansion (± 400 Elo).
  • 20s+: Total barrier removal to guarantee a match.
• Dynamic Temporal Limits: Match duration scales based on the average Elo of the paired fighters:
  • Beginner (<1400 Elo): Easy algorithm, 10-Minute timer.
  • Advanced (1400 - 1800 Elo): Medium algorithm, 20-Minute timer.
  • Elite (1800+ Elo): Hard algorithm, 30-Minute timer.

🏟️ The Battlefield (Live Arena)

• Real-Time Multiplayer: Built on Socket.io, featuring live opponent progress bars and an integrated in-match Chat (Comm-Link).
• Multi-Language Compiler: Integrated with the JDoodle API, executing code securely in JavaScript, Python 3, or C++. Features a custom API-Pooling architecture to bypass strict rate limits.
• Reactive Mascots: The UI reacts to your code. Fail a test case, and Babidi appears in the console to mock you. Win a match, and Mr. Satan photobombs the victory screen.
• Anti-Disconnect Grace Period: A 10-second server buffer prevents accidental drops from immediately ruining a match, processing true forfeits via Chess Elo math.

⏱️ Solo Practice (Hyperbolic Time Chamber)

• A stress-free /training environment where users can practice Codeforces-style (Standard I/O) algorithms without risking their Power Level (Elo).
• Features dynamic background swapping—shifting from the Time Chamber dimension to the Tournament of Power upon selecting a module.

🏆 Progression & Hall of Legends

• DBZ Elo Tier System: Users progress through 7 distinct classifications (from Earthling Fighter up to God of Destruction and Ultra Instinct).
• Global Leaderboard: A highly stylized, horizontal-gradient UI that perfectly maps server-wide rankings without covering the environment art.

🎨 Cinematic UX/UI

• Glassmorphism & Advanced CSS: Heavy use of backdrop-blur, CSS blend modes, and transparent gradients to allow high-fidelity environment art (Kami's Lookout, Kame House) to bleed organically through the interface.
• Framer Motion: Smooth page transitions, levitating mascots (Piccolo guarding the login server), and a custom "Cinematic Weather Engine" (Lightning and Shenron summoning sequences).
• Audio Engine: Fully integrated sound design (charging Kamehamehas, UI Goku themes, teleportation effects) optimized around strict browser autoplay policies.

---

🛠️ Tech Stack

• Frontend: React (Vite), Tailwind CSS v3, Framer Motion, Monaco Editor (Code Editor)
• Backend: Node.js, Express.js
• Real-Time: Socket.io
• Database: MongoDB Atlas, Mongoose (Models for Users, Problems, and Matches)
• Authentication: JSON Web Tokens (JWT), bcrypt
• Execution Environment: JDoodle Compiler API

---

⚙️ Local Installation & Setup

Prerequisites

• Node.js (v16+)
• MongoDB Atlas cluster (or local MongoDB)
• JDoodle API Credentials

1. Clone the repository

git clone [https://github.com/suyashg-22/CodeStrike.git](https://github.com/suyashg-22/CodeStrike.git)
cd CodeStrike

2. Backend Setup

cd backend
npm install

Create a .env file in the backend directory:

PORT=5000
MONGO_URI=your_mongodb_connection_string
JWT_SECRET=your_super_secret_key
# You can add multiple JDoodle keys to utilize the API Rotation Pool
JDOODLE_CLIENT_ID_1=your_id
JDOODLE_CLIENT_SECRET_1=your_secret

Start the server:

npm start

3. Frontend Setup

cd frontend
npm install

Start the Vite development server:

npm run dev

The application will be running at http://localhost:5173.

---

🤝 Contributing

Contributions, issues, and feature requests are welcome! Feel free to check the issues page.

📝 License

This project is licensed under the MIT License.

Disclaimer: Code Strike is a fan-made passion project. Dragon Ball, Dragon Ball Z, Dragon Ball Super, and all related characters and images are the property of Akira Toriyama, Toei Animation, and Bird Studio.