01219245/cocos2d-js/getting started

This is part of 01219245.

This document describes steps to start game programming on Cocos2d-JS.

A note on a standard installation: Cocos2d-JS is a part of the Cocos2d-x game framework that supports C++, Lua, and JavaScript. Clearly, JS denotes that it is a framework for "JavaScript". Previously, you can install the Cocos2d-JS framework separately. The whole Cocos2d-x framework gets re-organized and to use Cocos2d-JS you have download the whole framework which is pretty huge (405MB). To save you time, I have provided an empty project template for you to download. This document shows how to begin coding from that template.

Required software

The template that you will download contains all the Cocos2d-JS framework. But since your games will run in a browser, you need a way to provide game source codes and resources to the browser. Therefore, you need to run a web server on your laptop. The easiest way is to use a simple web server (HTTP server) provided by Python.

If you are using Ubuntu or Mac OS, you do not have to install python as it is already installed in your OS.

Installation for Windows users

Download Python: here. There are two versions Python 3.5.1 and Python 2.7.11. Both versions work, but I recommend Python 3.5.1.

After the installation, make sure you can call the Python interpreter. Test it by calling

python --version

It would replies with the version of Python you are running. You may have to add paths to Python when you call it, or you can add the path to bin/python.exe to your environment.

The template

In our first tutorial, we will start building from the HelloWorld template generated by the full Cocos2d-x installation. You can download it here:

• Download: helloproject.zip

You can save it anywhere and unzip it to any directory where you would like to keep all your Cocos2d-x projects.

After you have unzipped the template, you should see the following directory:

helloproject

In that directory, you should see these files and directories:

CMakeLists.txt  frameworks  index.html  main.js  manifest.webapp  project.json  res  src

We will discuss about these files when we start writing our first game. For now, start a terminal (cmd.exe for windows, terminal for ubuntu and mac os), and change directory to the helloproject directory.

Then, call (for Python 2):

python -m SimpleHTTPServer

or, if you install Python 3:

python -m http.server

to start a web server. You will see that it prints the following messages (or similar messages):

Serving HTTP on 0.0.0.0 port 8000 ...

To see our game, open a web browser (Chrome/Safari/Firefox) and put in the following URL

localhost:8000

In the browser, if you see the following screen, then you have successfully started a HelloWorld example for Cocos2d-x.

Notes: Later on, when you want to start a new project, we shall provide an "empty" project template (that only contains empty GameLayer class) so that you do not have to clean up the template files.

Full installation

You can also have a full installation of the Cocos2d-x framework by downloading it at cocos2d-x website.