How to Program Games: Tile Classics in JS for HTML5 Canvas
- 4.4
-
![]()
![]()
![]()
![]()
Brief Introduction
Learn to code tile-based worlds and related core gameplay for genres like arcade, overhead racing, and puzzle adventure.Description
By taking this new course you'll program several classic game types that all incorporate 2D tile-based worlds. You'll code in JavaScript for HTML5 Canvas, so a text editor and ordinary web browser are all you need (an art program can be handy for a few sections but is not required). I've attached my code for each step so you'll never be stuck. At the end you'll learn even more ways to apply what you've learned. Also by completing the course you'll get a PDF of my complete 500-page textbook on game development: Hands-On Intro to Game Programming. The book contains over 100 exercises, a couple of more game types, and additional material with more detail about the projects you created in this course.
(HTML5 Logo in the course image is by W3C, licensed under Creative Commons Attribution 3.0 Unported. Background pattern for transition cards CC BY-SA 3.0 Subtle Patterns © Atle Mo. drawn by Paul Phönixweiß.)
Requirements
- Requirements
- Any plain text editor like Notepad will do, however one which supports features for programmers such as multiple file tabs, code highlighting, line numbers, and smart/auto-indentation can be handy for later phases as the code grows in length (Notepad++ is free for Windows, TextWrangler for Mac, or Sublime Text 2 which I use has a fully functional free trial for either)
- Any common web browser should work fine, although I use Google Chrome (free) so you may prefer that one just to see on your side exactly how it shows up in the videos
- To follow along the few steps for drawing art you'll need a program that lets you draw and save images with transparency. I use a slightly older version of Photoshop, although free alternatives exist and the steps are similar. I also attach all art files that I create, so if you prefer to only focus on the coding steps you can download the images that I create in the videos.
Chris DeLeon
4.4 Raiting
How to Program Games: Tile Classics in JS for HTML5 Canvas
- 4.4
-
![]()
![]()
![]()
![]()
![]()
Learn to code tile-based worlds and related core gameplay for genres like arcade, overhead racing, and puzzle adventure. I've attached my code for each step so you'll never be stuck....
