Inspiration

Our inspiration for FootDraft Auction came from the desire to solve common frustrations with traditional fantasy football. We found existing apps to be too cluttered, repetitive, and overly reliant on luck instead of strategy. We wanted to create a game that was a true test of a user's football knowledge and strategic thinking, where every decision—from player selection to budget management—mattered, instead of depending on computer-generated dice rolls. We envisioned a more engaging experience that felt less like a chore and more like an authentic manager simulation.

What it does

FootDraft Auction is a full-stack web application that allows users to build a football team through a strategic auction draft. Users start with a fixed budget and must "buy" players to assemble their squad. The application features:

A live player market with real-time player data.

An interactive squad builder with drag-and-drop functionality and penalties for players playing out of position.

A trivia mini-game that rewards football knowledge with in-game currency.

A stopwatch timer to challenge users to build their squad as fast as possible.

A shareable final summary of the user's completed squad and draft stats.

How we built it

We built FootDraft Auction using a modern and robust technology stack. The backend is powered by Java Spring Boot, which handles all the game's core logic, including player transactions and trivia checks. For our data, we used Supabase, a cloud-based service that provides a backend-as-a-service, acting as our database and authentication layer. The frontend was built with React and Next.js to create a single-page application with a sleek, responsive UI styled with Tailwind CSS.

Challenges we ran into

Our biggest challenge was ensuring a seamless, real-time experience across the entire application. We struggled with team management, particularly when a user bought or sold a player. We had to ensure that the user's budget and team updated instantly across all components without requiring a full page refresh. Another significant hurdle we faced was integrating the stopwatch timer to be both accurate and synchronized with the draft's start and stop events.

Accomplishments that we're proud of

We are most proud of successfully creating a dynamic, interactive drafting experience. The trivia mini-game adds a unique layer of strategy that sets our app apart. The drag-and-drop functionality for player swapping and the out-of-position rating penalty were particularly challenging to implement, and we're proud of how smoothly they work in the final product. We've created a game that is not only functional but also satisfying to play and engaging.

What we learned

Throughout this project, we learned the importance of effective state management in a full-stack application. We gained a deeper understanding of how to manage data flow between the backend and frontend using REST APIs. We also learned how to leverage the power of a service like Supabase to handle complex database interactions and authentication, which allowed us to focus more on the core gameplay features.

What's next for footDraft Auction

We have several ideas for future enhancements. We plan to add real-time head-to-head drafts where two users can compete against each other to build the best team. We also want to implement leaderboards to track the highest-rated teams and the fastest draft times. Finally, we'll introduce manager challenges that reward users for drafting a team with specific constraints, such as a budget limit or a team composed of players from a single nation

Share this project:

Updates