Free canvas reference sheet to download:

https://github.com/chrisdixon161/HTML5-Canvas-Quick-Reference

Project stages for comparison:

https://github.com/chrisdixon161/Introduction-To-Javascript-Game-Development-Course-Part-1

If you have ever wondered how to build simple 2d games which work in the browser, then this class is going to be exactly what you are looking for!

Since Javascript is built into all major browsers, it is perfect for building browser-based games, and during this class, we will build a simple pong-style game to learn what you need to know.

Beginning with the HTML5 Canvas. This element is used to draw inside the browser, including images, shapes, text, and animations. Making it perfect for 2d games. If you have not used it before, we look at everything you need to know to draw, including how the grid system works.

Along with this, we also look at:

Text, Lines & Paths
Co-ordinates
Math calculations
Looping
Moving objects with the keyboard
Detecting collisions and bouncing off the walls and paddles
Keeping track. of scores
Starting and ending the game
Adding randomness to the bouncing to make the game less predictable
Computer movement
Restricting movement on the canvas

All of this combines into a 2d game covering all of the essentials you need to build more games on your own.

The class is beginner-friendly and I try to explain everything as we go, however a little Javascript experience will really help your understanding and experience. I also have classes on this subject if required.

Looking forward to seeing you in the first lesson!

Leandro Sena

--

4