Bug Battle ! | Devpost

Main screen
Waiting screen
Gameplay screen
Vellum workflow

Bug Battle - The competitive coding game that turns debugging into an exciting multiplayer experience where developers can finally have fun while building real-world skills.

Inspiration 🍀

Let's face it. There are two things everyone hates: bugs, and bugs in real life. Debugging is tedious and frustrating, but it's an essential skill that most people never actively work on. With Bug Battle, we wanted to make a game that’s fun and helps people improve this often-neglected skill.

What it does 🤷‍♀️

Bug Battle is a competitive 1 v 1 game where players face off in three exciting rounds of debugging challenges. In each round, players race to find and fix bugs in code while trying to outsmart their opponents in a time constraint. The game features power-ups that add strategic depth to matches - players can activate Line Corruption to edit 2 lines instead of just 1, or use Time Freeze to pause their timer for 15 seconds when they need extra thinking time. The scoring system rewards different skills: Bug Hunters earn 100 points for successfully fixing bugs, Bug Introducers get 50 points if their planted bugs go undetected, and players receive speed bonuses for quick fixes. Players can challenge friends to see who can debug faster and more accurately, making the usually boring task of debugging into an exciting competition!

How we built it 🧑‍💻

We built Bug Battle using modern web technologies including React for the frontend, Node.js and Express.js for the backend, and Socket.io to handle real-time multiplayer functionality. We integrated Judge0 API to evaluate code submissions and used Vellum workflows to generate test cases and answers. The entire application was developed using Html, JavaScript and TypeScript with custom CSS styling.

Challenges we ran into 😭

During our hackathon, we faced some technical challenges that slowed our progress. One issue was Vellum's slow response times, which created performance problems in our product at first. To fix this, we had to add caching and preload responses, which took extra development time we hadn't planned for. We also had to work with learning new technologies on the fly, especially Judge0, while working under tight deadlines. These obstacles forced us to quickly adapt and find creative solutions to keep our project moving forward.

Accomplishments that we're proud of 😤

We're proud that we were able to implement features beyond just our original minimum viable product ideas. We successfully created a fully functional multiplayer experience with real-time gameplay, which was more ambitious than we initially planned. The fact that everything works smoothly together despite using multiple APIs and new technologies feels like a major win!

What we learned 🧐

We learned how to use Socket.io for creating multiplayer experiences and gained valuable experience working with Vellum workflows. We also discovered how to integrate multiple APIs effectively and handle real-time data synchronization between players.

What's next for Bug Battle 🔜

Although we started with support for Python since it's the most popular language for coding interviews, we would like to add support for more programming languages in the future. Adding a wider variety of power-ups could also be very fun to explore, giving players more strategic options during matches.