math-game

A real time browser-based math game for up to 10 concurrent users.

The game is structured as a continuous series of rounds, where all connected players compete to submit the correct answer first. The number of rounds is not limited, players can connect at any time and start competing.

At the beginning of each round a simple math challenge is sent to all connected players, consisting of a basic operation (+ - * /), two operands in range 1..10 and a potential answer. All players are presented with the challenge and have to answer whether the proposed answer is correct using a simple yes/no choice.

The first player to submit a correct answer gets 1 point for the round and completes the round. All incorrect answers subtract a point from the players' score. Correct late answers do not affect the score. After completing the round all remaining players are informed that the round is over. A new round starts in 5 seconds after the end of last one.

Table of Contents

• Architecture
• Prerequisites
• Setup
• Run
• Test
• Live Demo

Architecture

The application follows a typical client-server model, with multiple clients and one server.

Both client and server are written in Typescript:

• The client side is built with Angular 6, using Bootstrap 4 for layout and styling.
• The server side with Express 4/Node.js.
• Client/server communication is handled with websockets, using Socket.IO 2.

Prerequisites

• Fast Node Manager (fnm)

Setup

cd client
npm install
cd ../server
npm install
npx tsc -t es5 ./src/index.ts

Run

In a command prompt, run:

cd server
node dist/index.js

In another command prompt, run:

cd client
npx ng serve --open

Test

Due to a known bug of the new Angular CLI tests must be executed with the --source-map=false option:

cd client
npx ng test --source-map=false

Live Demo

The client is hosted on Google Firebase and the server on Heroku.

• MathGame