Cocos2D HTML 5 Tutorial Series table of contents

The following are the tutorials covering Cocos2D-html, the HTML5 port ofCocos2dHTML5 the popular Cocos2d-x library.  If you are looking to develop a 2D game using HTML5, this is an excellent place to start.

The tutorials were all updated on 8/12/2012 to the newest cocos2D code base.


Tutorial 1: Getting set up and running

This tutorial covers getting Cocos2D up and running on your development machine.  This includes installing WAMP, an Apache based web server. At the end of this tutorial, you will be able to run all the demos and get started developing with Cocos2D HTML.

Tutorial 2: Why it’s Hello World of course!

In this tutorial, you will create your very first Cocos2D application, the ubiquitous Hello World.  It goes through the creation of boilerplate code and explains program execution flow. By then end of this tutorial, you will have a running Cocos2D HTML application.

Tutorial 3: All about sprites and positioning

This tutorial covers the process of loading a sprite from file and displaying it on screen.  It also goes into detail about how Cocos2D deals with coordinates, something it does very differently from many applications. By the end of this tutorial, you will be able to draw and position sprites.

Tutorial 4: It’s all about control

This tutorial covers handling input and mouse events in cocos2D.  By the end of this tutorial, you will be able to add mouse and keyboard controls to your game.

Tutorial 5: Menus, sounds, and music

This tutorial covers playing music and sound effects.  It also demonstrates creating a menu and handling menu selections.

Tutorial 6: Spritesheets

This tutorial covers creating and using spritesheets, a collection of sprites in a single image.

Related content

Setting up JetBrains WebStorm to work with Cocos2D

This post goes through configuring the IDE WebStorm so auto-completion works ideally with Cocos2D.

Cocos2D book round-up

This is a one-page resource for all books currently available on Cocos2D, the library cocos2D-x and cocos2D-HTML are based off.  If you are looking for more details, this is a good place to start.

Cocos2D with a Node.js server

This post is part of a series on creating a simple client-server game.  This covers how to host a cocos2D application in a Node server.

Cocos2D alpha 2 released.  Small changes required

With the release of alpha2, some very minor changes were added that effect tutorials 2, 3, and 4.  This post describes those changes and how to fix your code to work with alpha 2.  Don’t worry, the changes are extremely minor.

Scroll to Top