Oh Snap!

Please turnoff your ad blocking mode for viewing your site content

Hit enter after type your search item

Udemycoup is an online learning platform

Code Your First Game Arcade Classic in JavaScript on Canvas

Code Your First Game Arcade Classic in JavaScript on Canvas

Code Your First Game Arcade Classic in JavaScript on Canvas

Program a complete game today. No special software or install required. All you need is a text editor and a web browser.


Lecture: 12
Time Required: 2 hour
Downloadable Resources: 11
Access: Life Time
Access on mobile and TV
Certificate of Completion


Very early on students will need to show file extensions in their operating system (explained briefly in the video)
If a plain text editor is available that has programming features like line numbers and auto-indent (ex. Notepad++ on PC, TextWrangler on Mac) that may be handy but is not necessary, as a generic text editor like Notepad or TextEdit will work fine for a program of this size

What you will learn

Display, position, and move filled shapes for retro and prototype gameplay
Move a ball around your game space such that it bounces off boundaries
Handle real-time mouse input
Detect and respond to simple collisions
Program very basic artificial intelligence
Keep and display score during play
Understand the subtle, key difference between a classic game in this style which is fun to play versus one that isn’t
Define and code a win condition and end state for your game

Targeted Audience

This is for anyone who wants a quick but thorough introduction to simple game programming in a way that doesn’t require any special software, download, or installation
If you’ve had at least a little exposure to generic programming concepts like variables, functions, and if-statements you’ll have an advantage, however in case you’ve never heard those terms they’re explained briefly as they come up
Although this a uses JavaScript and HTML5, it is not intended for someone who is focused on learning HTML5/JS for web page design

Take This Course

Leave a Comment

Your email address will not be published. Required fields are marked *

This div height required for enabling the sticky sidebar