Setting up phaser for html5 game development

Phaser is a javascript framework for developing html 5 games. Since it’s a javascript framework, all you have to do is to include this phaser.js library into your html just how you include jquery in your html file. The other requirement is that you need an actual web server to run games developed with phaser, you are free to use any web server you like, apache server, node server, python server, tomcat, etc.

3 options to get phaser.js

1. Just use a cdn that hosts the phaser.js and include it in your html file.

<script src="//cdn.jsdelivr.net/phaser/2.4.6/phaser.min.js"></script>

2. Download the phaser.js from and include it in your html file.

<script src="path/to/your/phaser/js/file/phaser.js"></script>

3. Clone the phaser source code from github, build it and include the phaser.js your html file. This will require you know how to use git, and you have npm installed and of course you are a pro on command lines. Here are a series of commands to build the phaser.js file. This should get you the phaser.js that you can use it in your html file.

sudo npm install -g grunt-cli
git clone https://github.com/photonstorm/phaser.git
cd phaser
sudo npm install
grunt
cd dist
ls -l

Now you know how to use phaser, you can just search for some sammple phaser projects in google or github, put it in your web server root directory, and you are all set to start play around with phaser.

For those who don’t know what’s git, npm, grunt:
git is a very popular version control system that you use to manage your source code. Github is a very popular web service that you can use to host your source code with git. For example. you create a bunch of html files and javascript files in a folder on your computer, now you want to keep track of the changes you make to the html or javascript codes. You use git to do that, but you don’t have a server to host the source code remotely with git, then Github comes into play, you upload your source code to Github. BitBucket is another alternative to GitHub.

npm stands for node package manager, you use it to install node.js libraries/modules. node is a javascript framework for the backend server development, you can actully use node to create a web server for your phaser project since phaser games do need a web server in order for it to work.

grunt is command line tool for building javascript projects, it does things like concatenating files, running tests, minifying javascript files, etc. phaser uses grunt to build the phaser.js from the source files so when you type grunt in the phaser directory, it will build the source files and generate the phaser.js in the dist folder. It’s similar to the ant for java, makefile for c, etc.

Search within Codexpedia

Custom Search

Search the entire web

Custom Search