Skip to content
Learn how to build 2D HTML5 Breakout game with pure JavaScript
HTML
Branch: gh-pages
Clone or download

Latest commit

Latest commit 6c57535 Mar 4, 2019

Files

Permalink
Type Name Latest commit message Commit time
Failed to load latest commit information.
img images Apr 30, 2015
CNAME cname Mar 29, 2015
LICENSE Create LICENSE Feb 28, 2019
README.md readme update Apr 30, 2015
index.html typo May 5, 2015
lesson01.html jsfiddles, links, formatting Apr 15, 2015
lesson02.html jsfiddles, links, formatting Apr 15, 2015
lesson03.html jsfiddles, links, formatting Apr 15, 2015
lesson04.html jsfiddles, links, formatting Apr 15, 2015
lesson05.html Lesson 5: issue with game over scenario in chrome Nov 9, 2017
lesson06.html fix: declare variable Apr 20, 2018
lesson07.html fix: declare variable Apr 30, 2018
lesson08.html fix: declare variable Apr 30, 2018
lesson09.html fix: declare variable Apr 30, 2018
lesson10.html fix: declare variable Apr 30, 2018

README.md

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.

You can’t perform that action at this time.