Please enable JavaScript to use CodeHS

Video Game Design in JavaScript (2022) - Outline

  1. Programming With Karel

    1. 1.1 Introduction to Programming With Karel

    2. Video 1.1.1 Introduction to Programming With Karel
    3. Quiz 1.1.2 Quiz: Karel Commands
    4. Example 1.1.3 Our First Karel Program
    5. Exercise 1.1.4 Your First Karel Program
    6. Exercise 1.1.5 Short Stack

    7. 1.2 More Basic Karel

    8. Video 1.2.1 More Basic Karel
    9. Quiz 1.2.2 More Basic Karel Quiz
    10. Example 1.2.3 Tennis Ball Square
    11. Exercise 1.2.4 Make a Tower
    12. Exercise 1.2.5 Pyramid of Karel

    13. 1.3 Karel Can't Turn Right

    14. Video 1.3.1 Karel Can't Turn Right
    15. Quiz 1.3.2 Karel Can't Turn Right Quiz
    16. Example 1.3.3 Tower and Turn Right
    17. Exercise 1.3.4 Slide Karel
    18. Exercise 1.3.5 Fireman Karel

    19. 1.4 Functions in Karel

    20. Video 1.4.1 Functions in Karel
    21. Quiz 1.4.2 Functions in Karel Quiz
    22. Example 1.4.3 Turn Around
    23. Exercise 1.4.4 Pancakes
    24. Exercise 1.4.5 Mario Karel

    25. 1.5 The Start Function

    26. Video 1.5.1 The Start Function
    27. Quiz 1.5.2 The Start Function Quiz
    28. Example 1.5.3 Tower with Start Function
    29. Exercise 1.5.4 Pancakes with Start

    30. 1.6 Top Down Design and Decomposition in Karel

    31. Video 1.6.1 Top Down Design and Decomposition in Karel
    32. Quiz 1.6.2 Top Down Design and Decomposition Quiz
    33. Example 1.6.3 Hurdle Karel
    34. Exercise 1.6.4 The Two Towers

    35. 1.7 Commenting Your Code

    36. Video 1.7.1 Commenting Your Code
    37. Quiz 1.7.2 Commenting Your Code Quiz
    38. Example 1.7.3 Hurdle Karel
    39. Exercise 1.7.4 The Two Towers + Comments

    40. 1.8 Super Karel

    41. Video 1.8.1 Super Karel
    42. Quiz 1.8.2 Super Karel Quiz
    43. Example 1.8.3 Hurdle Karel (with SuperKarel)
    44. Exercise 1.8.4 The Two Towers + SuperKarel

    45. 1.9 For Loops

    46. Video 1.9.1 For Loops
    47. Quiz 1.9.2 For Loops Quiz
    48. Example 1.9.3 Repeated Move
    49. Example 1.9.4 Put Down Tennis Balls
    50. Exercise 1.9.5 Take 'em All
    51. Exercise 1.9.6 Dizzy Karel
    52. Exercise 1.9.7 For Loop Square
    53. Exercise 1.9.8 Lots of Hurdles

    54. 1.10 If Statements

    55. Video 1.10.1 If Statements
    56. Quiz 1.10.2 If Statements Quiz
    57. Example 1.10.3 If Statements
    58. Example 1.10.4 Safe Take Ball
    59. Exercise 1.10.5 Is There a Ball?

    60. 1.11 If/Else Statements

    61. Video 1.11.1 If/Else Statements
    62. Quiz 1.11.2 If/Else Statements Quiz
    63. Example 1.11.3 If/Else Statements
    64. Example 1.11.4 One Ball in Each Spot
    65. Exercise 1.11.5 Right Side Up

    66. 1.12 While Loops in Karel

    67. Video 1.12.1 While Loops in Karel
    68. Quiz 1.12.2 While Loops in Karel Quiz
    69. Example 1.12.3 Move to Wall
    70. Exercise 1.12.4 Follow The Yellow Ball Road
    71. Exercise 1.12.5 Lay Row of Tennis Balls
    72. Exercise 1.12.6 Big Tower

    73. 1.13 Control Structures Example

    74. Video 1.13.1 Control Structures Example
    75. Quiz 1.13.2 Control Structures Example Quiz
    76. Example 1.13.3 Cleanup Karel
    77. Exercise 1.13.4 Random Hurdles

    78. 1.14 More Karel Examples and Testing

    79. Video 1.14.1 More Karel Examples and Testing
    80. Quiz 1.14.2 Quiz: Which Control Structure?
    81. Example 1.14.3 Move Tennis Ball Stack
    82. Example 1.14.4 Climbing Karel

    83. 1.15 How to Indent Your Code

    84. Video 1.15.1 How to Indent Your Code
    85. Quiz 1.15.2 How to Indent Your Code Quiz
    86. Example 1.15.3 Dance and Clean Karel
    87. Exercise 1.15.4 Diagonal
    88. Exercise 1.15.5 Staircase
    89. Badge 1.15.6 Karel Exercises Badge

    90. 1.16 Challenge Problems

    91. Challenge 1.16.1 Fetch
    92. Challenge 1.16.2 Racing Karel
    93. Challenge 1.16.3 Tower Builder
    94. Challenge 1.16.4 Super Cleanup Karel
    95. Challenge 1.16.5 Double Tennis Balls
    96. Badge 1.16.6 Karel Challenges Badge

    97. 1.17 Programming with Karel Quiz

    98. Quiz 1.17.1 Programming with Karel Quiz

  2. JavaScript and Graphics

    1. 2.1 Hello World

    2. Video 2.1.1 Hello World
    3. Quiz 2.1.2 Hello World Quiz
    4. Example 2.1.3 Hello World
    5. Exercise 2.1.4 Your Name and Hobby

    6. 2.2 Variables

    7. Video 2.2.1 Variables
    8. Quiz 2.2.2 Variables Quiz
    9. Example 2.2.3 Basic Variables
    10. Exercise 2.2.4 Apples and Oranges

    11. 2.3 User Input

    12. Video 2.3.1 User Input
    13. Quiz 2.3.2 User Input Quiz
    14. Example 2.3.3 Basic User Input
    15. Exercise 2.3.4 Grocery Store

    16. 2.4 Basic Math in JavaScript

    17. Video 2.4.1 Basic Math in JavaScript
    18. Quiz 2.4.2 Basic Math in JavaScript Quiz
    19. Example 2.4.3 Simple Calculator
    20. Example 2.4.4 Dollars to Pounds
    21. Example 2.4.5 Dividing Up Groups
    22. Exercise 2.4.6 T-Shirt Shop
    23. Exercise 2.4.7 Running Speed

    24. 2.5 Using Graphics in JavaScript

    25. Video 2.5.1 Graphics
    26. Quiz 2.5.2 JavaScript Graphics Quiz
    27. Example 2.5.3 Graphics Hello World
    28. Example 2.5.4 Blue Circle
    29. Example 2.5.5 Red Rectangle
    30. Example 2.5.6 8 Ball
    31. Exercise 2.5.7 French Flag
    32. Exercise 2.5.8 Snowman

    33. 2.6 Booleans

    34. Video 2.6.1 Booleans
    35. Quiz 2.6.2 Booleans Quiz
    36. Example 2.6.3 First Boolean
    37. Exercise 2.6.4 Do You Have a Dog?

    38. 2.7 Logical Operators

    39. Video 2.7.1 Logical Operators
    40. Quiz 2.7.2 Logical Operators Quiz
    41. Example 2.7.3 Light Switch
    42. Example 2.7.4 President
    43. Example 2.7.5 Wasting Time
    44. Exercise 2.7.6 Can You Graduate?
    45. Exercise 2.7.7 School's Out

    46. 2.8 Comparison Operators

    47. Video 2.8.1 Comparison Operators
    48. Quiz 2.8.2 Comparison Operators Quiz
    49. Example 2.8.3 Voting Age
    50. Example 2.8.4 Grade Range
    51. Exercise 2.8.5 Rolling Dice
    52. Exercise 2.8.6 All Star

    53. 2.9 If Statements

    54. Video 2.9.1 If Statements
    55. Quiz 2.9.2 If Statements Quiz
    56. Example 2.9.3 Negative Numbers
    57. Example 2.9.4 Great Names
    58. Example 2.9.5 Even and Odd
    59. Example 2.9.6 Secret Password
    60. Exercise 2.9.7 Teenagers
    61. Exercise 2.9.8 Stop Light

    62. 2.10 For Loops in JavaScript

    63. Video 2.10.1 Basic For Loop
    64. Quiz 2.10.2 For Loops Quiz
    65. Example 2.10.3 For Loop
    66. Exercise 2.10.4 Chalkboard
    67. Exercise 2.10.5 The Worm
    68. Exercise 2.10.6 Caterpillar

    69. 2.11 General For Loops

    70. Video 2.11.1 General For Loop
    71. Quiz 2.11.2 General For Loop Quiz
    72. Example 2.11.3 Countdown
    73. Example 2.11.4 Count By Twos
    74. Exercise 2.11.5 Count By Sevens
    75. Exercise 2.11.6 Powers of Two

    76. 2.12 For Loop Practice

    77. Video 2.12.1 For Loop Examples
    78. Quiz 2.12.2 For Loop Examples Quiz
    79. Example 2.12.3 For Loop Sum
    80. Exercise 2.12.4 Better Sum
    81. Exercise 2.12.5 Factorial
    82. Exercise 2.12.6 All Dice Values

    83. 2.13 Random Numbers

    84. Video 2.13.1 Random Numbers
    85. Quiz 2.13.2 Random Numbers Quiz
    86. Example 2.13.3 Rolling a Die
    87. Example 2.13.4 Flipping a Coin
    88. Exercise 2.13.5 Lots of Dice
    89. Exercise 2.13.6 Random Color Square

    90. 2.14 While Loops

    91. Video 2.14.1 While Loops
    92. Quiz 2.14.2 While Loops Quiz
    93. Example 2.14.3 While Loop Countdown
    94. Exercise 2.14.4 Inventory
    95. Exercise 2.14.5 Fibonacci

    96. 2.15 Loop and a Half

    97. Video 2.15.1 Loop and a Half
    98. Quiz 2.15.2 Loop and a Half Quiz
    99. Example 2.15.3 Adding Up Numbers
    100. Exercise 2.15.4 Snake Eyes
    101. Exercise 2.15.5 Better Password Prompt

    102. 2.16 Functions and Parameters 1

    103. Video 2.16.1 Functions and Parameters 1
    104. Quiz 2.16.2 Functions and Parameters Quiz 1
    105. Example 2.16.3 Double Number
    106. Exercise 2.16.4 Square
    107. Exercise 2.16.5 Triple

    108. 2.17 Functions and Parameters 2

    109. Video 2.17.1 Functions and Parameters 2
    110. Quiz 2.17.2 Functions and Parameters Quiz 2
    111. Example 2.17.3 Sum Function
    112. Exercise 2.17.4 Area of Triangle
    113. Exercise 2.17.5 Height in Meters

    114. 2.18 Functions and Parameters 3

    115. Video 2.18.1 Functions and Parameters 3
    116. Quiz 2.18.2 Functions and Parameters Quiz 3
    117. Example 2.18.3 Draw Circles
    118. Exercise 2.18.4 Horizontal Lines
    119. Exercise 2.18.5 Graphics Stop Light
    120. Exercise 2.18.6 Pool Table

    121. 2.19 Functions and Return Values 1

    122. Video 2.19.1 Functions and Return Values 1
    123. Quiz 2.19.2 Functions and Return Values Quiz
    124. Example 2.19.3 Double Number
    125. Exercise 2.19.4 Square with Return Values
    126. Exercise 2.19.5 Triple with Return Values

    127. 2.20 Functions and Return Values 2

    128. Video 2.20.1 Functions and Return Values 2
    129. Quiz 2.20.2 Functions and Return Values Quiz 2
    130. Example 2.20.3 Return Values
    131. Exercise 2.20.4 Is It Even?
    132. Exercise 2.20.5 Max

    133. 2.21 Local Variables and Scope

    134. Video 2.21.1 Local Variables and Scope
    135. Quiz 2.21.2 Local Variables and Scope Quiz
    136. Example 2.21.3 Return Values
    137. Exercise 2.21.4 Local Variables
    138. Badge 2.21.5 JavaScript Exercises Badge

    139. 2.22 JavaScript and Graphics Challenges

    140. Challenge 2.22.1 Ghosts
    141. Challenge 2.22.2 Draw Something
    142. Badge 2.22.3 JavaScript Challenges Badge

    143. 2.23 Javascript and Graphics Quiz

    144. Quiz 2.23.1 Javascript and Graphics Quiz

  3. Project: Guessing Game

    1. 3.1 Guessing Game

    2. Challenge 3.1.1 Guessing Game

  4. Animation and Games

    1. 4.1 Timers

    2. Video 4.1.1 Timers
    3. Quiz 4.1.2 Timers Quiz
    4. Example 4.1.3 Moving Ball
    5. Example 4.1.4 Magic 8 Ball
    6. Exercise 4.1.5 Crazy Ball

    7. 4.2 Random Circles

    8. Video 4.2.1 Example: Random Circles
    9. Quiz 4.2.2 Random Circles Quiz
    10. Example 4.2.3 Random Circles
    11. Example 4.2.4 Spinner Example
    12. Exercise 4.2.5 Growing Circle
    13. Exercise 4.2.6 Paint splatter

    14. 4.3 Random Ghosts

    15. Video 4.3.1 Example: Random Ghosts
    16. Quiz 4.3.2 Random Ghosts Quiz
    17. Example 4.3.3 Random Ghosts
    18. Example 4.3.4 Random Fireworks
    19. Exercise 4.3.5 Circle Wall

    20. 4.4 Bouncing Ball

    21. Video 4.4.1 Example: Bouncing Ball
    22. Quiz 4.4.2 Bouncing Ball Quiz
    23. Example 4.4.3 Bouncing Ball
    24. Exercise 4.4.4 Hotspot Ball
    25. Exercise 4.4.5 Trail

    26. 4.5 Mouse Events: Mouse Clicked

    27. Video 4.5.1 Mouse Events: Mouse Clicked
    28. Quiz 4.5.2 Mouse Events: Mouse Clicked Quiz
    29. Example 4.5.3 Click For Circles
    30. Example 4.5.4 Click For Ghosts
    31. Exercise 4.5.5 Teleporting Ball
    32. Exercise 4.5.6 Pause

    33. 4.6 Mouse Events: Mouse Moved

    34. Video 4.6.1 Mouse Events: Mouse Moved
    35. Quiz 4.6.2 Mouse Events: Mouse Moved Quiz
    36. Example 4.6.3 Simple Painting
    37. Example 4.6.4 Colorful Drag to Paint
    38. Exercise 4.6.5 Coordinates
    39. Exercise 4.6.6 Target

    40. 4.7 Drawing Lines

    41. Video 4.7.1 Example: Drawing Lines
    42. Quiz 4.7.2 Drawing Lines Quiz
    43. Example 4.7.3 Drawing Lines
    44. Exercise 4.7.4 Leash

    45. 4.8 Key Events

    46. Video 4.8.1 Key Events
    47. Quiz 4.8.2 Key Events Quiz
    48. Example 4.8.3 Keyboard Square
    49. Exercise 4.8.4 Basic Snake
    50. Exercise 4.8.5 Drag and Drop

    51. 4.9 Animation and Games Quiz

    52. Quiz 4.9.1 Animation and Games Quiz
    53. Badge 4.9.2 Animation Exercises Badge

  5. Crazy Ball Game

    1. 5.1 Crazy Ball Game

    2. Video 5.1.1 Crazy Ball Game 1
    3. Quiz 5.1.2 Crazy Ball Game Quiz 1
    4. Example 5.1.3 Crazy Ball Game 1
    5. Video 5.1.4 Crazy Ball Game 2
    6. Quiz 5.1.5 Crazy Ball Game Quiz 2
    7. Example 5.1.6 Crazy Ball Game 2

  6. Project: Breakout

    1. 6.1 Breakout

    2. Challenge 6.1.1 Bricks
    3. Challenge 6.1.2 Ball and Paddle
    4. Challenge 6.1.3 Breakout
    5. Badge 6.1.4 Breakout Badge

  7. Project: Fun Snake

    1. 7.1 Fun Snake

    2. Challenge 7.1.1 Fun Snake 1
    3. Challenge 7.1.2 Fun Snake 2
    4. Challenge 7.1.3 Fun Snake 3
    5. Challenge 7.1.4 Fun Snake 4 - A Full Game!

  8. Basic Data Structures

    1. 8.1 Intro to Lists/Arrays

    2. Video 8.1.1 Intro to Lists/Arrays
    3. Quiz 8.1.2 Intro to Lists/Arrays Quiz
    4. Example 8.1.3 Making an Array
    5. Exercise 8.1.4 List of Places to Travel
    6. Exercise 8.1.5 List of Even Numbers

    7. 8.2 Indexing Into an Array

    8. Video 8.2.1 Indexing Into an Array
    9. Quiz 8.2.2 Indexing into an Array Quiz
    10. Example 8.2.3 Array Indexing Practice
    11. Exercise 8.2.4 Top Websites

    12. 8.3 Adding/Removing From an Array

    13. Video 8.3.1 Adding/Removing From an Array
    14. Quiz 8.3.2 Adding/Removing from an Array Quiz
    15. Example 8.3.3 Add/Remove From Array
    16. Exercise 8.3.4 Practice Push and Pop

    17. 8.4 Array Length and Looping Through Arrays

    18. Video 8.4.1 Array Length and Looping Through Arrays
    19. Quiz 8.4.2 Array Length and Looping Through Arrays Quiz
    20. Example 8.4.3 Print Shopping List
    21. Example 8.4.4 Sum Array
    22. Exercise 8.4.5 Product of List
    23. Exercise 8.4.6 Print Flight Itinerary
    24. Exercise 8.4.7 Double List
    25. Exercise 8.4.8 Evens Only List
    26. Exercise 8.4.9 Reverse List

    27. 8.5 Iterating Over an Array

    28. Video 8.5.1 Examples: Iterating Over an Array
    29. Quiz 8.5.2 Iterating Over an Array Quiz
    30. Example 8.5.3 Coin Flips
    31. Example 8.5.4 Many Crazy Balls
    32. Exercise 8.5.5 Coin Flip Fun: Number of Heads and Tails
    33. Exercise 8.5.6 Coin Flip Fun: Longest Streak of Heads
    34. Exercise 8.5.7 Changing Circles
    35. Exercise 8.5.8 Draw a Barcode

    36. 8.6 Finding an Element in a List

    37. Video 8.6.1 Finding an Element in a List
    38. Quiz 8.6.2 Finding an Element in a List Quiz
    39. Example 8.6.3 Array indexOf
    40. Exercise 8.6.4 Who is in Line?

    41. 8.7 Removing an Element From an Array

    42. Video 8.7.1 Removing an Element From an Array
    43. Quiz 8.7.2 Removing an Element from an Array Quiz
    44. Example 8.7.3 Splice and Remove
    45. Exercise 8.7.4 Remove From Line

    46. 8.8 Intro to Objects/Maps

    47. Video 8.8.1 Intro to Objects/Maps
    48. Quiz 8.8.2 Intro to Objects / Maps Quiz
    49. Example 8.8.3 Phonebook
    50. Exercise 8.8.4 Sidekicks

    51. 8.9 Basics of Objects

    52. Video 8.9.1 Basics of Objects
    53. Quiz 8.9.2 Basics of Objects Quiz
    54. Example 8.9.3 Object Literal Phonebook
    55. Example 8.9.4 Object Property Phonebook
    56. Example 8.9.5 Beware Dot Notation!
    57. Exercise 8.9.6 Address Book

    58. 8.10 Iterating Over an Object

    59. Video 8.10.1 Iterating Over An Object
    60. Quiz 8.10.2 Iterating over an Object Quiz
    61. Example 8.10.3 Print Phonebook
    62. Exercise 8.10.4 Hogwarts

    63. 8.11 When Do I Use an Object?

    64. Video 8.11.1 When Do I Use An Object?
    65. Quiz 8.11.2 When do I use an Object Quiz
    66. Example 8.11.3 Facebook Friend Lists
    67. Example 8.11.4 Does the Key Exist?
    68. Exercise 8.11.5 Text Messages

    69. 8.12 Intro to Sets

    70. Video 8.12.1 Intro to Sets
    71. Quiz 8.12.2 Intro to Sets Quiz
    72. Example 8.12.3 Basic Sets
    73. Exercise 8.12.4 Vowels
    74. Exercise 8.12.5 Mutual Friends
    75. Exercise 8.12.6 Total Network of Friends

    76. 8.13 Intro to Grids

    77. Video 8.13.1 Intro to Grids
    78. Quiz 8.13.2 Intro to Grids Quiz
    79. Example 8.13.3 Grid Basics

    80. 8.14 Looping Over a Grid

    81. Video 8.14.1 Looping Over a Grid
    82. Quiz 8.14.2 Looping Over a Grid Quiz
    83. Example 8.14.3 Print Grid
    84. Exercise 8.14.4 Summing Grid

    85. 8.15 Grid Example: Get a Row

    86. Video 8.15.1 Grid Example: Get a Row
    87. Quiz 8.15.2 Grid Example: Get a Row Quiz
    88. Example 8.15.3 Get a Row
    89. Exercise 8.15.4 Grid Diagonal
    90. Badge 8.15.5 Data Structures Exercises Badge

    91. 8.16 Basic Data Structures Quiz

    92. Quiz 8.16.1 Basic Data Structures Quiz

  9. Project: Tic Tac Toe

    1. 9.1 Tic Tac Toe

    2. Challenge 9.1.1 Tic Tac Toe: Part 1
    3. Challenge 9.1.2 Tic Tac Toe: Part 2
    4. Challenge 9.1.3 Tic Tac Toe: Full Game
    5. Badge 9.1.4 Tic Tac Toe Badge

  10. Project: Helicopter Game

    1. 10.1 Game Design: Helicopter

    2. Video 10.1.1 Introduction to Helicopter

    3. 10.2 Basics

    4. Video 10.2.1 Moving the Helicopter
    5. Exercise 10.2.2 Moving the Helicopter
    6. Video 10.2.3 Adding Obstacles
    7. Exercise 10.2.4 Adding Obstacles
    8. Video 10.2.5 Smoother Movement
    9. Exercise 10.2.6 Smoother Movement

    10. 10.3 Improvements

    11. Video 10.3.1 Colliding with Walls
    12. Exercise 10.3.2 Wall Collisions
    13. Video 10.3.3 Colliding with Obstacles
    14. Exercise 10.3.4 Obstacle Collisions
    15. Video 10.3.5 Adding Terrain
    16. Exercise 10.3.6 Adding Terrain
    17. Video 10.3.7 Moving the Terrain
    18. Exercise 10.3.8 Moving the Terrain

    19. 10.4 Polish

    20. Video 10.4.1 Helicopter Image and Points!
    21. Exercise 10.4.2 Image and Points
    22. Video 10.4.3 Dust
    23. Exercise 10.4.4 Dust
    24. Video 10.4.5 More Obstacles
    25. Exercise 10.4.6 More Obstacles
    26. Challenge 10.4.7 Helicopter Extensions
    27. Badge 10.4.8 Helicopter Badge

  11. Final Project: Your Own Game

    1. 11.1 Final Project

    2. Free Response 11.1.1 Plan Your Game
    3. Challenge 11.1.2 Final Game

  12. Midterm

    1. 12.1 Midterm

    2. Midterm 12.1.1 Midterm Pt 1: Multiple Choice

  13. Connect Four

    1. 13.1 Connect Four

    2. Exercise 13.1.1 Make The Board
    3. Exercise 13.1.2 Take Turns
    4. Exercise 13.1.3 Find the Winner

  14. Project MasterMind

    1. 14.1 Mastermind

    2. Connection 14.1.1 How to Play Mastermind
    3. Demo 14.1.2 Mastermind: Demo
    4. Exercise 14.1.3 Generate Number List
    5. Exercise 14.1.4 Get User Guess
    6. Exercise 14.1.5 Compare User to List!
    7. Exercise 14.1.6 Finish the Game!
    8. Exercise 14.1.7 Mastermind Board