Practice multiplayer game & Discussion

When deciding on what kind of application i wanted to create using phaser framework, I decided I would create an online multiplayer game.

While discussing my project over with a friend who happens to be an expert in using phaser framework, we discussed the possibilities of the application and what would be required to achieve such a feat, after researching for awhile we found a way to create a basic HTML5 multiplayer game using phaser for the game development and for client/server communication, this was to be my first in depth dive into this kind of development.

The game was based around multiplayer tank game, where user’s would join the game whenever they wanted and try to attack the other tanks that were in game. Now that wasn’t really what the tutorial was about, the tutorial gave information about using and setting up how to have more than one player in the application. is an RPC library.

The practice game is based off a tutorial that is meant to help beginners get a grasp on creating an online game using phaser and


Firstly i had to create a new project in my htdocs, called it multiplayer. This was going to hold all the files for the game. Next I installed the assets required for this game and the tank script as i wasn’t too interested in the tank script and more interested in the other pieces of code, setting up and learning about server set-ups.

I had to use the terminal a lot in this process to install various files.  I started by creating a basic web server for the game, here we installed express library for nodejs, to make file service simpler. I had to used the terminal and change directory into the folder that had the game files.


Then run this command in the terminal : npm install express

I then created a server.js script and added it to the root directory of the game, and added the following code.

var express = require(‘express’)
  , app = express(app)
  , server = require(‘http’).createServer(app);
// serve static files from the current directory
After this was added and saved, I ran this next piece in the terminal : node server.js
This starts the server for our game.


I then opened my browser for the test phase, using in the url, my browser opened up the practice game.

It’s Working!!

Next part was to install and prepare using can use either or sockjs as network transport layer, by default, is used. to use with the default configuration we’ll need to install and

We do this in the terminal again using : npm install and npm install

After the install has completed we modify the server code and add eureca stuff before the server.listen(8000)

note: image of the specified code, as well as the code I added.
Then I added some event listeners to detect client connections and disconnections.
Note: Image of the specified code, as well as the code I added.
We then add eureca.js script to the index.html just before the tank.js script, by typing src=“/eureca.js”>. This will allow to be available to the client, next we added this next piece of code into tanks.js.
This is creating the client initialization method “eurecaClientSetup”, which instantiates Client and wait for the client to be ready, it then calls the method create, this was initially called by Phaser.Game instantiation method.
Note: code is edited later in tutorial.
 If creating a multiplayer game, its important to make sure the server is available before starting the game code, this is what we are doing with eurecaClientSetup.
With this part of the tutorial done, when navigating to the localhost in the URL the server should have detected that a client has connected and when they disconnect.
Note: This blog was suppose to be posted a couple weeks ago, I forgot, i will be updating my posts more with the practice game and actual work for project 2 WEB701 over the following week.



Leave a Reply

Fill in your details below or click an icon to log in: Logo

You are commenting using your account. Log Out / Change )

Twitter picture

You are commenting using your Twitter account. Log Out / Change )

Facebook photo

You are commenting using your Facebook account. Log Out / Change )

Google+ photo

You are commenting using your Google+ account. Log Out / Change )

Connecting to %s