The JavaScript DOM Game Developer Bundle

2 Reviews
8 Courses & 50 Hours
You save 98% -

What's Included

HTML5 Canvas: Create 5 Games & 5 Projects
  • Certification included
  • Experience level required: Beginner
  • Access 80 lectures & 10 hours of content 24/7
  • Length of time users can access this course: Lifetime

Course Curriculum

80 Lessons (10h)

  • Your First Program
  • Create simple HTML5 Canvas Game with JavaScript Pong Game
    SECTION HTML5 Canvas Game Introduction2:19
    Pong Game Source Code
    1 Setup of HTML5 Game_Board5:42
    2 Draw more shapes on_Canvas9:23
    3 KeyBoard Interaction9:50
    4 Second object on Screen9:11
    5 Animation Frames3:35
    6 collision detection8:00
    7 Bouncing Ball11:28
    8 Final Game_Tweaks14:18
    9 Pong Game Code Review4:28
  • Create a Game HTML5 Canvas Simple Game with JavaScript
    SECTION Introduction Catcher_Game1:34
    Source code
    1 Setup Game HTML code1:41
    2 JavaScript Create_Elements6:35
    3 Keyboard Event_Listeners9:16
    4 Drop random_items5:18
    5 Move Random_Objects5:21
    6 Add Colors and Set_hazards8:05
    7 Collission Detection_HTML513:05
    8 Collision Actions3:41
    9 Add Scoring to Game7:34
    10 Game Controls9:03
    11 Start Game_Option14:42
    12 Catcher Game Code Review9:05
  • Create an HTML5 Canvas game JavaScript MouseClick Popper
    SECTION Introduction Bubble_Popper2:00
    Source Code
    1 Setup HTML for Game6:15
    2 Gradient Fill5:09
    3 Generate Bubbles5:28
    4 Moving Bubbles_HTML57:58
    5 Making Bubbles_More5:49
    6 Add Moue Clicks on_Canvas12:37
    7 Mouse Click Collision Detection8:19
    8 Multiple Array Collision Detection4:22
    9 Game Scoring_Canvas6:55
    10 FInal Code Review Bubble_Popper10:37
  • HTML5 JavaScript Battle War Canvas Game from Scratch
    SECTIOn Battle Game_Introduction2:00
    Source Code
    1 HTML5 Setup and Draw7:15
    2 Drawing Paths_Canvas7:09
    3 Drawing Circles_Canvas7:26
    4 Animation Frame9:15
    5 Keyboard Event Listener Move8:44
    6 Add Second_Player8:08
    7 Movement Conditions7:23
    8 Shooting Keypresses10:49
    9 Collision Detection_Objects12:48
    10 Player Scoring5:27
    11 Game Reset5:03
    12 Game tweaks and Updates3:30
    13 Opponent Brain_Logic13:17
    14 Opponent Brain Logic 212:37
    15 Opponent Attack_Mode9:39
    16 Game Tweaks and Adjustments5:40
    17 Section Code_Conclusion11:31
    18 Bonus Update 2 Brains23:53
  • JavaScript HTML5 Breakout Game Block Breaker
    SECTIONBrick Breaker Game_Introduction2:04
    Source Code
    1 Breakout Game_Setup6:08
    2 Setup Player_Paddle4:37
    3 Player Movement_KeyPresses5:14
    4 Move Player_Paddle4:02
    5 Mouse Movement_Player4:20
    6 Add a Bouncing Ball9:43
    7 Collision Detection14:35
    8 Add Bricks to Screen11:31
    9 Update Bricks3:59
    10 Scoring and_Win10:10
    11 Final Game tweaks and_Adjustments11:29
    12 Bug Fixes and Tweaks9:21
    13 Bouns Content14:50
    14 Ball Speed_Update4:23
    15 Final Game Code Review11:06
  • Course Questions and Answers - Useful Code Snippets and Code examples
    1 Write to Canvas Download_Image15:35
    2 HTML5 Canvas Matrix Effect14:07
    3 HTML5 Canvas Bouncing Ball9:03
    4 How to Upload to_Canvas13:51
    5 Draw on_Canvas28:57
    Section Source Code

HTML5 Canvas: Create 5 Games & 5 Projects

Laurence Svekis

Laurence Svekis | Instructor, GDE, Application Developer

4.3/5 Instructor Rating: ★ ★ ★ ★

Providing Smart digital solutions online since 2001, Laurence Svekis is considered a true web technology expert. He has professional experience in a wide range of digital areas, from Search Marketing, Video Marketing, Content creation, User Experience, application architecture, and web programming.

The applications he has created have entertained, informed, and engaged tens of millions of people. He has over billions of page views on various platforms and has sent millions of click-through visitors. He has developed hundreds of web applications, from microsites to enterprise-level platforms.


This is a hands-on course that will help you put your HTML5 skills and knowledge into practice. In this course, you will learn how to create your first game using HTML 5 Canvas. You will create a fun, interactive battle game with a computer brain and dynamic values. Some examples of Canvas-based games you can create are the following: Pong, Catcher, Bubble Popper, Brick Breakout, and Battle Bots. You will also work on 5 projects. This course requires prior coding experience to help you work easier.

4.7/5 average rating: ★ ★ ★ ★

  • Access 80 lectures & 10 hours of content 24/7
  • Make Canvas-based games
    • HTML5 Canvas Pong Game. Hit the ball between 2 players on screen
    • HTML5 Canvas Falling Items Catcher Game. Catch items as they fall
    • Bubble Popper. Score when you click & pop endless bubbles that float up the screen
    • Brick Breakout Game. Build your version of this classic brick breaker game
    • Battle Bots Game. Create 2 player interaction & response to game actions
  • Create 5 projects
    • Download canvas image to computer
    • Create a Matrix falling letters effect using HTML5 Canvas
    • Explore how to make a bouncing ball on canvas
    • Upload images from your computer into canvas
    • Draw on canvas simple drawing application project


Important Details

  • Length of time users can access this course: lifetime
  • Access options: desktop & mobile
  • Redemption deadline: redeem your code within 30 days of purchase
  • Experience level required: beginner
  • Have questions on how digital purchases work? Learn more here


  • HTML & CSS
  • JavaScript experience
  • Web programming experience


  • Unredeemed licenses can be returned for store credit within 30 days of purchase. Once your license is redeemed, all sales are final.
Your cart is empty. Continue Shopping!
Processing order...