Learn how to build 2D HTML5 Breakout game with pure JavaScript

Visit breakout.enclavegames.com page for the list of available lessons.

MDN Breakout gameplay

In this step-by-step tutorial we create a simple MDN Breakout game written entirely in pure JavaScript and rendered on HTML5 Canvas. Every step has editable, live samples available to play with so you can see what the intermediate stages should look like. You will learn the basics of using the Canvas element to implement fundamental game mechanics like rendering and moving images, collision detection, control machanisms, and winning and losing states.