Battlegrounds Diary

Bildnachweis: http://playhearthstone.com

I admit - I am an avid video gamer 1 And even if my Steam Library is bursting at the seams - I have been finding time for Hearthstone for the last 5 years. And just when I was seriously losing interest in the game 2, Blizzard came up with its own interpretation of an Auto-Battler 3 and completely recaptured me.

In fact, I played it so much over the Christmas holidays that I started to get interested in the statistics behind it - a constant attempt at self-improvement. Unfortunately the data behind the "FullStat" button is not really meaningful. In fact, even important positions like "Total Games Played" are missing. That's why I started building my own game tracker. And in the simplest way possible. You can see the result here: Battlegrounds Diary

How it all works can be seen here in a video demo here:

Also I created an Album with a screenshots.

History View
Chart View

The software stack is the following:

  • Vue.js as a Frontend Framework (of choice)
  • Vuex- for global state management
  • Vuex-persistedstate - a Vuex plugin that saves the state to localStorage - its awesome!
  • Vue-Unicons
  • Vue Bootstrap - for rapid prototyping. And really - this is the best CSS Library for prototyping in Vue.js. And I tried a lot of them.
  • Chartjs - the Chart Library to go!

As you may can see by the stack - the data is stored in your browser, but can be exported as a JSON file and imported into another browser. So there is no login necessary. But the downside is - if the user is changing the browser or deletes the his local files - the data is gone. So I implemented a basic Import/Export Function for JSON Files (here is an example).

This is a temporary solution. In the long term, I need another solution here. Considerations are "Automatic storage in cloud storage (like Google Drive or Dropbox)" or "Write my own backend API with NoSQL database". What route I will go depends on a few things. Like - a lot of people are using the tool and Blizzard is not implementing their own Stat Page (like they did with Overwatch).

Since I am almost the only user until today I would be glad about feedback. For me it works very well, but I can imagine that other players would have different requirements for such a tool. I am also looking forward to see issues and pull requests directly on Github.

  1. Although I strongly dislike the term gamer. Probably "person with a strong affection for immersive single player experience" describes me a bit better.

  2. One reason was that I got bored with the game, the Blitzchung controversy and the bad handling of the whole thing on a corporate level.

  3. In short: an Auto-Battler - also called Auto-Chess - focuses on the actual preparation of a match - while the match itself is completely automatic. These games come in all colors and shapes but this explanation should probably do it first.