Summary
Keywords
Full Transcript
An introduction to game development tutorial using vanilla JavaScript and HTML5 canvas. Build a complete brick-breaker game while learning the fundamentals of game development. 💻 Code / Completed Project: https://codesandbox.io/s/z2pqr9620m ❤️ Try interactive JavaScript courses we love, right in your browser: https://scrimba.com/freeCodeCamp-JavaScript (Made possible by a grant from our friends at Scrimba) ⭐️ Course Contents ⭐️ ⌨️ (00:00) Introduction ⌨️ (00:32) Project Setup and Canvas ⌨️ (02:07) Drawing on the Canvas ⌨️ (04:25) Clearing the Canvas ⌨️ (05:45) Creating the Player's Paddle ⌨️ (11:42) The Game Loop ⌨️ (15:47) Handling Keyboard Input ⌨️ (17:56) Moving the Paddle ⌨️ (21:36) Stopping the Paddle ⌨️ (23:10) Drawing the Ball Image ⌨️ (26:59) Moving the Ball ⌨️ (32:11) Refactoring to the Game Class ⌨️ (38:54) Collision Detection between the Ball and Paddle ⌨️ (43:19) Loading Bricks ⌨️ (46:24) Building Levels ⌨️ (51:22) Collision Detection with Bricks ⌨️ (56:54) Pause Screen ⌨️ (1:02:08) A Simple Start Menu ⌨️ (1:06:09) Game Over ⌨️ (1:10:13) Completing Levels 🎥 Tutorial from Crhis Perko. Check out his YouTube channel: https://www.youtube.com/channel/UCraxnACLukXNgBnCq1zQnNg 🔗 Chris Perko's blog: https://chrisperko.net 🐦 Chris on Twitter: https://twitter.com/chrisjperko
Continue this lesson in the app
Install CourseHive on Android or iOS to keep learning while you move.
