Valboard

• 

  Sentinels vs 100 Thieves Match Result

• 

  MIBR GC vs 2Game Esports GC Results & Predictions

• 

  Team Heretics vs Apeks Upcoming scoreboard

• 

  Match prediction UI

• 

  Superteam UI

• 

  Submission confirmation UI

• 

  Post prediction upcoming scoreboard UI

• 

  Team Heretics vs Apeks Match Result

• 

  FUT Esports vs KOI Live scoreboard

Inspiration

The main inspiration for Valboard was the soccer scoreboard app. I wanted the same functionality but for Valorant esports in the r/ValorantCompetitive subreddit.

What it does

The app generates a real-time scoreboard for all upcoming, live, and finished Valorant esports matches. For upcoming matches, users can predict the final score, the winning team and assemble a 'Superteam'—a lineup of the five highest-rated players in the match. Those who correctly predict the score, the winner, and the top five performers win!

How we built it

The main scoreboard is built with Reddit's native block components, and the score and superteam prediction UI are built using web views.

Challenges we ran into

The only headscratcher was figuring out how to switch between upcoming-live-result pages while keeping the app performant, especially on mobile.

Accomplishments that we're proud of

How seamlessly the app runs—just deploy and relax. Once you create an upcoming match scoreboard, the app handles everything: managing timers, calculating predictions, and dynamically switching pages based on the match state while keeping the UI responsive.

What we learned

The main thing I learned was designing with the block components and how the rerender cycles occur when you have several useAsyncs and one useInterval running.

What's next for Valboard

A leaderboard, customizations for the superteam (eg, making a player MVP - double the points), fixing bugs and making the app even more performant, especially for mobile devices.

Built With

• devvit
• docker
• fastapi
• framer-motion
• python
• react
• render
• tailwind
• typescript