starmelt edited this page Jan 29, 2012 · 17 revisions

Welcome to starmelt's Crafty tutorials!

Update 01/29/12: Upgrading to Crafty 0.4.5.

Update 01/28/12: Upgrading to Crafty 0.4.4. Please note that the 'polished' version of Same Game is a bit broken now, as Crafty's 'Tween' component has a but in 0.4.4 which causes the Entities to be moved too far by a few pixels. It is fixed on crafty-DEV already (Issue #140).

Update 06/24/11: Upgrading to Crafty 0.4.3

Here you can find some basic tutorials to get you started with the current version (0.4.3) of CraftyJS, a JavaScript Game Engine.

Most of the tutorial give some additional explanation to a piece of JavaScript Code from the github Repository. The File is linked on top of each of the tutorial pages and you will most likely want to open it in a new Browser tab or in your favorite Text Editor while reading the tutorial page! At least that's the intended usage.

CraftyJS is a JavaScript library for game development. Get it now from http://craftyjs.com!

  1. The Basics

    Basic technical background and first steps.

    1. Program Structure and Entity Instantiation
    2. The Game Loop
    3. Creating Components
    4. Custom Canvas Drawing
  2. A first Game

    Implementing the puzzle game 'Same Game' with CraftyJS.

    1. Creating a Game Board
    2. Adding the Game Logic
    3. Refactoring to use the Underscore.js library
    4. Polishing the Game

    This is how the result will look like!

  3. Advanced

    Some more interesting stuff.

    1. PixelFonts