Autoplay
Autocomplete
Previous Lesson
Complete and Continue
JavaScript DOM Games
JavaScript Click Popper Game
0 JavaScript Game Introduction (1:56)
0 Developer Setup (3:05)
1 Setup HTML (2:46)
2 Select Elements JavaScript DOM (5:33)
3 Setup Player Stats update HTML (3:26)
4 Handle Button Click (3:44)
5 Get Game Data (5:45)
6 CSS with Start Game (5:18)
7 Add Elements JavaScript (8:05)
8 Game Play Starter (6:05)
9 Make Element Clickable (5:47)
10 Add random Icon (5:12)
11 Add Score Elements JavaScript (3:17)
12 Game Over JavaScript (4:44)
13 Final Code Review (13:09)
Source Code
JavaScript practice build a game Card game
cardGamePROMO (0:56)
0 HiLo Game Course Introduction (2:57)
Section Source Code
0 Web Dev setup (2:20)
1 Game Board Setup (4:03)
2 Setup Game Variables (4:15)
3 Play the Game (8:05)
4 Build Card Deck (6:15)
5 Draw Random Card (5:13)
6 Build Card CSS (7:05)
7 Visual Card JavaScript Builder (6:14)
8 Game Logic Play Conditions (8:00)
9 Code Review and Tweaks (9:30)
JavaScript Word Scramble Game from scratch course
0 Word Game Introduction (1:24)
00 Car Game Dev Tools (2:12)
00 Dev Tools Setup (2:15)
1 Setup Word Guess Game (4:24)
2 JavaScript start Game (3:03)
3 Foreach Arrays JavaScript (7:43)
4 build interactive elements (5:29)
5 Add Game Play Show Word (2:38)
6 Check Correct and Win (3:07)
7 JavaScript Date Start Timer (4:20)
8 Game Tweaks and Update (3:16)
9 Source Code Review (7:04)
Section Source Code
Car driving Game JavaScript
PromoVideo (0:49)
0 Car Game Introduction (2:06)
00 Car Game Dev Tools (2:12)
00 Dev Tools Setup (2:15)
10 JavaScript Car Game Setup (4:02)
11 KeyPress Event Listeners (4:37)
12 RequestAnimationFrame Method (6:08)
13 Move Div with Keypress (6:30)
14 Road Builder (6:13)
15 Road lines moving (3:16)
16 Road Line Movement 2 (4:02)
17 Generate More Cars (5:43)
18 Check Collision Detection (4:32)
19 End Game Scoring (6:04)
20 Restart Game Function (2:21)
21 Random Color value (4:47)
22 Game Tweaks and adjustments (2:58)
23 Quick CSS update (2:13)
24 Car Game Code Review (12:52)
Source Code
JavaScript - Click Shape Game from Scratch
0 Game Introduction click shape (2:05)
Source Code
0 Web Dev setup and course tips (2:50)
1 Click Reaction Game (3:31)
2 Make it interactive (3:36)
3 Player Message (3:07)
4 Start the Gameplay JavaScript (3:36)
5 JavaScript Math Random (3:45)
6 JavaScript Create Elements (8:32)
7 Random Colors JavaScript (6:11)
8 Set Timeout Game (3:14)
9 Interactive Dynamic Element (6:07)
10 Reaction Game Review (4:42)
JavaScript Plane Bomber Game - DOM practice exercise
PlaneBomberPromo (1:00)
0 Bomber Plane Game Introduction (2:32)
source code
1 Game Area Setup (2:58)
2 KeyBoard Events (6:19)
3 Start Game (4:51)
4 Add animation frame (7:48)
5 Game fixes (4:39)
6 Game Scoring (2:58)
7 Show Scoreboard to player (2:25)
8 Add Enemy Base (5:13)
9 Make the bombs (7:30)
10 Move bombs Automatically (4:49)
11 Collision Detection (5:23)
12 Final Gameplay Tweaks (7:31)
13 Bomber Plane Code Review (7:20)
Click Games JavaScript - 2 Game projects from scratch
0 JavaScript Click Games Introduction (2:37)
source code
1 Game HTML Setup (3:27)
2 DOM MouseEvents (5:08)
3 Create Target Element (6:44)
4 Eventlisteners on new elements (2:34)
5 Animate the new element (9:05)
6 Add Scoring Game Tweaks (2:29)
7 Code Review Catch Me Application (5:13)
8 Reaction Game Setup (2:44)
9 Play the Game (1:57)
10 Create Target Element (5:53)
11 Event Handling Element (2:50)
12 Continue GamePlay (2:51)
13 Code Review Reaction Game (3:53)
JavaScript in Action - bird flying game fun with the DOM
birdyPromo30 (0:56)
0 Flying Bird Game Introduction (2:17)
source code
1 Game Setup Structure (4:16)
2 Add Event Listeners (4:00)
3 Keyboard event tracking (5:32)
4 Add element to page (3:47)
5 JavaScript RequestAnimationFrame (7:10)
6 Move Conditions (2:42)
7 Wing Movements (3:56)
8 Scoring and gravity (3:30)
9 Game End Conditions (4:17)
10 Create Obstacles (9:15)
11 Moving Obstacles (5:39)
12 Checking Collision Detection (6:52)
13 Handle Game Over (1:32)
14 Game Code Review (12:30)
15 Bonus Add Color (1:59)
JavaScript Number Guessing Game - JavaScript DOM
0 Introduction to Guesser Game (2:55)
Source code
1 Number Guess Game Setup2 (3:11)
2 DOM content Loaded (3:14)
3 Game Setup Function (3:44)
4 Get Random Number (5:16)
5 Add Event Listener (5:38)
6 Element Manipulation DOM (3:39)
7 GameOver and Restart (8:18)
8 Code Tweaks (3:59)
9 Number Guesser Code Review (6:56)
JavaScript Alien Invaders Game Project Course
0 Alien Invader Introduction (1:55)
source code
1 Game Play Setup (4:56)
2 Start Game Action (8:05)
3 Move Player Keyboard (4:56)
4 Starting the Game (3:51)
5 Container Boundary (2:24)
6 Fire Away Shooting (7:08)
7 Start Game Prep Aliens (7:13)
8 Create some Aliens (6:14)
9 Add Eyes and Features (5:05)
10 Lets Get Moving (6:26)
11 Tweaks and Fixes (6:26)
12 Hit Detection (7:50)
13 Hit Target handle (5:09)
14 Final Code Tweaks and Updates (5:52)
15 Quick Fix Alien Count (1:45)
16 Alien Invader Code Review (12:44)
JavaScript Card War Game Project Course
0 Battle Card Game Introduction (3:19)
source code
1 Game Area Setup (6:00)
2 Start the Game (5:50)
3 Create Deck of Cards (4:25)
4 Create Game Players (8:01)
5 Deal the cards (7:43)
6 Make Cards for Players (9:19)
7 Make the Card Look Better (4:27)
8 Game Logic (6:18)
9 Handle Winner of Deal (8:12)
10 Multiple Rounds Attack (5:42)
11 Fix Playoff Function (10:50)
12 Game Restart (5:25)
13 Tweaks and Fixes (11:27)
14 Battle Game Code Review (11:46)
15 Debug of Playoff Issue (1:49)
JavaScript Breakout Game from scratch with only JavaScript
brickbreaker (0:58)
Section Brick Breaker Game (1:51)
0 Brick Breaker Game (2:15)
Source Code
1 Game Setup (4:10)
2 Create Elements (10:05)
3 Keypresses Interaction (7:47)
4 Start Game Setup1 (3:35)
5 Setup Bricks (5:22)
6 Create Brick (6:24)
7 Quick Fix (2:27)
8 Bouncing Ball (6:17)
9 Collision Detection (10:50)
10 Brick Breaker (3:46)
11 Tweaks and Adjustments 1 (7:40)
12 Tweaks and Adjustments 2 (7:25)
13 Tweaks and Adjustments 3 (4:56)
14 Code Review (11:30)
0 Web Dev setup and course tips
Lesson content locked
If you're already enrolled,
you'll need to login
.
Enroll in Course to Unlock