Guild Wars 2 API Web App

A react.js web app that analyses data from the Guild Wars 2 WvW API

  • What is Guild Wars 2?

    Guild Wars 2 is a online game with a variety of game modes but this app focuses on data from World versus World.

  • What is World versus World?

    World versus World (WvW) is a large scale team-based gamemode wherein three worlds battle over objectives across four maps. This often involves hundreds of players.

  • What does my web app do?

    It reads data from the API to show an overview of the current matches and track activity without having to log into the game.

The Web App

There are already some great websites doing similar things (such as WvWIntel.com) but I felt there was a gap for a mobile friendly website that quickly and easily showed the important statistics that players like to talk about. I also wanted to be able to see how active WvW is at any given time.

The app has two main sets of data: how the match up is going (a week long match between three worlds) and what is actively happening in each of the four maps.

The source code for my app can be found on my Github profile.

A screenshot of the app showing the matchup overview and map details

The Motivation

Being able to write lines of code after teaching myself from complete beginner (with lots of great online resources), and produce a web app to show what hundreds of real people are doing in a virtual space, is an amazing feeling.

I had recently learnt Redux and read a few articles about arranging SCSS so was looking for a project to practise these things first hand. I also wanted to work with an API, a staple of many live projects, as well as practise working with high volumes of data.

Screenshot of some of the API's response data

The Analysis

The web app is dense with numbers and displays that may at first look overwhelming to one not familiar with the game. The first boxes show the overall statistics for the match ups (which start ever Friday evening and last for a week). The next four boxes, below the line, show statistics for each of the four maps that are fought over. Each world has a home map and the fourth is evenly divided between the three worlds.

World Overview

The world overview is a box showing world name, kills, deaths, the ratio between the two, the skirmish score, and the victory points

In the World Overview section we have the name of the world and any worlds it may currently be linked with (low population worlds are linked to other worlds to create fairer matches). To the right of the name is the PPT, or Points Per Tick. This is a term used by players to refer to the amount that the skirmish score increases and is determined by how many objectives are held.

Kills, deaths, and ratio are the total number of kills and deaths for that world so far this match up. The ratio between the kills and deaths is a popular metric with players for gauging the balance of fights between their world and the others.

Match ups are broken down into skirmishes of two hours and at the end of each skirmish, victory points are awarded based on which world has the highest skirmish score before the skirmish scores are reset to zero for the next skirmish. The winner of the match up is the one with the most victory points at the end.

Map Overview

The Map Overview shows the same information as the World Overviews, but for each map

Match ups are broken down into skirmishes of two hours and at the end of each skirmish, victory points are awarded based on which world has the highest skirmish score before the skirmish scores are reset to zero for the next skirmish. The winner of the match up is the one with the most victory points at the end.

Objectives Gained

Objectives Gained shows, with icons, how many of each objective type each world has taken on that map within the timeframe.

The Objectives Gained section shows how many of each objective have been captured by each world. Buttons at the top allow the user to change the timeframe of data to look at. One unfortunate shortcoming of this section is that it is unable to count an objective more than once if it has changed hands multiple times during the timeframe, but I am still happy with what I managed to achieve with the API.

Kills & Deaths Tracker

The Kills and Deaths Tracker plots a graph of kills and deaths for each world per map over 30 second intervals

The Kills & Deaths Tracker shows in real time* the action going on right now in WvW. This was a big achievement for me and involved planning out how to store, interpret, and display the data, and also meant learning more about <svg> to make the graphs. I used <title> to display the exact numbers on hover however, which works great on desktop but not on mobile so may need revisiting.


*I have been finding that sometimes the API stops getting the most recent game data during peak times and keeps sending the same snapshot in team, meaning the tracker will just show zero. Not sure if I can do anything about this on my end.

What I learnt

I learnt not to try to be too clever with Redux’s store. For a while, things started to get a bit muddy where I was heavily manipulating API data in Redux reducers. I used promise middleware and dispatched fetch requests. I got some very useful logs that helped me immensely, but I would reconsider this next time as being able to manipulate the returned data before dispatching to Redux’s store might have made for clearer code. I would also consider writing my own middleware.

This has been a very enjoyable project for me and I really furthered my understanding by using Redux first hand. Deploying this web app to Github Pages and being able to share it with my friends has been a dream come true and really boosted my confidence as a fledgling web developer. Being able to write lines of code after teaching myself from complete beginner (with lots of great online resources), and produce a web app to show what hundreds of real people are doing in a virtual space, is an amazing feeling.

When I had finished the web app I sat back and watched the kills tracker. I saw my world get a spike of 40 kills so logged in and went straight to that map where I saw someone from my guild commanding a big group of people so decided to join them. I think that memory will stay with me for a while.