Time:
December 2019 – 1 week

Main technologies used:
React, Bootstrap 4, Ruby on Rails (as an API), JSON Web Tokens

Github Repositories

Video Walkthrough

FanDota is a web app that allows users to follow eSports teams that play Dota 2, a game developed by Valve. A user can also see stats about different teams and see their latest matches. The web app also pulls data from the OpenDota API.

Motivations

I’ve been playing Dota 2 after watching The International 2 back in 2012. While I don’t have much time to play these days, I’ve followed the competitive scene for a while now. It goes without saying that I’m a pretty big fan! With that in mind, I decided to put into practice the React skills that I learned at Flatiron School during mod 4 and built FanDota.

Challenges

The challenges of this project included the following:

  • Having the front end dynamically display whether a user is following a team or not while having those updates in the backend persist through the join table between teams and their followers
  • Integrate JSON Web tokens so that the back end could encrypt and decrypt data that is held in the local storage of the browser

One thing that was particularly interesting when working with JSON Web Tokens was figuring out how to pass around an encrypted token between the front end and back ends for auto-login functionality. It turned out to be simpler than I thought when I had the encrypted token be a serialized custom attribute. The idea came from one of my coaches at Flatiron as I was trying out different solutions.

Takeaways and next steps

This project was fun because it got me to explore the other web apps out there that support the Dota 2 community. I enjoyed deep-diving the Open DotA API and see how much data there is to take apart and see possibilities of what could be done, like player statistics or match statistics.

One thing I wanted to do was further integrate other stats into the project to do something akin to what Basketball-reference.com does with NBA stats.