elodawg.com

• 

  Home Page

• 

  Create Leaderboard

• 

  Leaderboard Page

• 

  Record Game

• 

  Updated Leaderboard Page

Inspiration

Ever had that one friend that kept saying they were better than you at a game just because they beat you once? Frustrated that there isn't a standardized way to compare your skill between your friends? That's why we built elodawg.com, a simple quick way to start a private elo-based leaderboard with invite-only access.

What it does

elodawg.com lets anyone create their own private leaderboard where they can send an invite link to their close-by gamers. Leaderboards are guarded by a special unique code so that strangers can't just barge in.

Whenever two players in the same leaderboard have a match, they can go on elo board to record their results. Wins and losses affect those gamers' elo in that specific leaderboard. By having continuous wins against the top players, players will be able to quickly climb to show that they got better than their friends and to encourage more friendly competition.

How we built it

The backend was built completely with Python and Django to serve all the related APIs supporting both the leaderboard invite features and the elo system. We used SQLLite for the primary data storage and to handle the data transactions necessary.

A quick look at this ERD shows how the DB schema's interacted.

The elo system was inspired by the FIDE elo system which is used for keeping track of chess player ratings. More information about that can be found both in this (https://en.wikipedia.org/wiki/Elo_rating_system) and in our Github codebase.

The frontend was built using React.js. We prioritized making reusable components and adhering to best practices in order to produce clean code, such as having only one "Recent Games" component to be dynamically available for both the feed page and the leaderboard detail page. We used async REST calls to fetch data from the backend API and stored the data using functional hooks.

Challenges we ran into

Finishing an entire end-to-end full stack web application in only 24 hours was difficult for a 2 man team. We ran into some network problems while making the API calls from the client side which took some time to investigate and fix.

Accomplishments that we're proud of

We're excited that we were able to finish a fully-working app by the end of the hackathon. Especially since this idea of elodawg.com was something that both of us saw being a really interesting concept for social gaming groups, we're proud that we were able to get some exposure to it.

What we learned

"As someone who had little prior experience with contributing to full stack applications, I really picked up on a lot of skills and concepts essential to piecing together the frontend and backend" - Joshua Zhao

"Looking into elo systems and how each one was a little different was fascinating. Getting to implement my own basic version taught me a lot about ranking in gaming." - Danny Lee

What's next for elodawg.com

We want to deploy elodawg.com to be available to everyone once we can finish setting up registration and login authentication. In terms of functionality, it would be cool if we could add more data visualization where we can see player trends, correlations, and leaderboard data.

Built With

• django
• javascript
• python
• react
• sql