Game of Thrones Quiz Game with React and GraphQL

Introduction

Table of Contents

After two years of wait, the critically acclaimed final season of Game of Thrones has come and gone leaving most viewers half full and discontent. There was always that feeling that the final season of such a great show had to end with a bang that will keep viewers talking for months after it's completion, but that's not the feeling my friends and I got after watching the final episode. We felt it lacked the WOW factor and an element of surprise; some of you might beg to differ, but that's all right.

After the show ended, I decided to create a small Game of Thrones-themed quiz for games night, the idea was simple, an application that displays questions based on the show, users can take the quiz and view their results at the end of the quiz. It was meant to be an application I put together in one night so creating and maintaining a backend for the application wasn’t on the plan and at the same time using static data wouldn’t scale as the questions in the quiz could change.

After doing some research, I decided to settle on the following tools for the application:

  1. 8Base GraphQL: A backend database layer for our app. This is where we will store and read the questions on our application. With 8base, there won’t be a need to create and maintain a backend for the application.
  2. React for the frontend application.

With the tools i just mentioned, we’ll create the quiz application and test it when we are done. In this course, we'll walk through the process of creating this application and setting up a backend using the 8base platform. Before we get into it, let’s take a look at the requirements

Requirements

To follow this tutorial, a basic understanding of React and Node.js is required. Please ensure that you have Node and npm/yarn installed before you begin.

We’ll also make use of some GraphQL queries in the project, so some familiarity with GraphQL is needed. If you have no prior knowledge of these technologies, we have a list of courses about them here on Scotch that you can quickly learn and then come back and continue this course.

Like this article? Follow @codebeast on Twitter