Fast and Furious Game Development with JavaScript and AI
"Fast and Furious Game Development with JavaScript and AI" was created to take anyone with or without experience in coding, teach them HTML5 + CSS and JavaScript from the ground up using Graphics and Game Development as the platform to learn. And then with the fundamentals in hand, we take one of the most exciting journeys in computing and we learn how to use Generative AIs like ChatGPT to build working games! Thus, this is really three courses in one.
In the first part of the course, we start with how the internet and HTML work with respect to browsers. Then we start off with a "Hello World" in HTML and build our first web page. From there, lecture after lecture, we dig deeper and deeper into the most important features of HTML5 + CSS, so you can create basic websites with formatting, styling, controls and more. So, if you have never made a website in your life, you will learn step by step in this part of the course. Even if you are a seasoned programmer that has never got around to learning HTML5 + CSS you will enjoy this section.
More
In the next part of the course we cover JavaScript from the ground up, we will learn the basics of variables, math, conditionals, loops, functions, and more. As the lectures progress, we cover more and more advanced subjects like event driven programming, recursion, and object oriented programming in JavaScript. Then we switch gears and start learning about computer graphics and game development as we continue to learn JavaScript features. We learn how to draw on the HTML5 Canvas, how to animate sprites, and perform simple physics simulations. Of course, along the way, we learn how to interface with the keyboard and mouse and how to integrate our HTML pages (websites) with JavaScript and how to send messages between them. Additionally, we learn how to manipulate the DOM (Document Object Model) which is the tree like data structure that represents your webpages. Learning a new language can be a daunting task, but learning a new language using graphics and game development as the platform to learn is the only way to do it! I promise it won't be boring.
In the last part of the course, we delve into AI and ChatGPT. At this point in the course, you're a skilled JavaScript programmer with all the tools needed to make complete games. However, instead of making games by ourselves, we are going to learn to collaborate with the most advanced AI in the world (arguably) ChatGPT. You will learn how to "Prompt" ChatGPT to create working skeletons of classic arcade games. You will learn how to steer the AI to get it to generate working code along with its limitations through "Prompt Engineering". Then after ChatGPT gives us a working skeleton of a game then you and I will take that game and finish it with what we have learned and add graphics, sound, music, and more game play features. We will do this over half a dozen times as we re-create classic games that are fun to play as well as amazing achievements for an AI to create. We will build these games and more:
- Pong
- Breakout / Arkanoid
- Snake
- Flappy Bird
- 3D Wire Frame Space Shooter
- Space Invaders
- Blackjack
- RetroRift (ChatGPT original)
Finally, the course also comes with free electronic PDF copies of some of my most classic game development books that have taught millions of students and professionals game development over the years:
- "Tricks of the Windows Game Programming Gurus"
- "The Black Art of 3D Game Programming"
- "Tricks of the 3D Game Programming Gurus"
In closing, this course takes the hottest subjects in computing; JavaScript + HTML5, Game Development and Artificial Intelligence with ChatGPT and blends them together in a way no one has ever done before making learning these subjects fun and engaging. And with the knowledge you learn, you can deploy games and apps that run on billions of devices that support browsers. That's a Super Power you want to have in your toolbox!
Watch Online Fast and Furious Game Development with JavaScript and AI
| # | Title | Duration |
|---|---|---|
| 1 | Let’s Get Ready to Rumble: Introduction, Setup and Installation | 35:22 |
| 2 | Intro to the Web HTML/CSS Basics and the DOM | 52:03 |
| 3 | Building our First Web Page and Using Online Editors | 01:06:35 |
| 4 | HTML Primer - Getting to Know the Basic Tags | 45:42 |
| 5 | Adding a Bit of Drama with Style, Div, and Span Tags | 59:53 |
| 6 | Embedding Images and Sounds in HTML | 57:29 |
| 7 | Getting Things Done with Buttons and Input Controls | 54:40 |
| 8 | Working with Forms and Introduction to CSS (Cascading Style Sheets) | 54:01 |
| 9 | Exploring More Advanced CSS Styling and Animation | 30:18 |
| 10 | JavaScript Primer++ - Getting to Know Types, Objects, Variables, Math and Debug | 55:47 |
| 11 | JavaScript Debugging Techniques and External Scripts | 45:25 |
| 12 | Working with Basic Types Part I - Strings, Arrays, Number, and Math Objects | 51:34 |
| 13 | Basic Types Part II - Strings, Arrays, Bit Operations, Number and Math Objects | 57:15 |
| 14 | More Math, Arrays, and Functions - Part III | 58:48 |
| 15 | Advanced Arrays, Functions, and Interacting with the DOM | 55:09 |
| 16 | Making Decisions with "if" - Part I | 01:02:21 |
| 17 | Advanced Conditionals and the Switch Statement - Part II | 01:02:59 |
| 18 | Repeating Code and Looping with "for" and "while" | 59:17 |
| 19 | Reusing Code with Functions | 01:07:11 |
| 20 | Advanced Function Concepts - Anonymous Functions, Callbacks and Recursion | 51:05 |
| 21 | Introducing "Objects" Part I - And Other Things That Go Bump in the Night | 46:28 |
| 22 | Objects Part II - Advanced Concepts, Methods, Properties, and Constructors | 55:25 |
| 23 | Using Pre-Written APIs and Objects and Benchmarking with Time and Date Objects | 41:26 |
| 24 | Interfacing to the HTML DOM Part I: Fundamentals, Handlers and Node Manipulation | 01:00:21 |
| 25 | Interfacing to the HTML DOM Part II: Adding Elements and More Event Handlers | 40:44 |
| 26 | Graphics and Animation with the Canvas Part I: Points, Lines, Pixels, Color | 01:03:51 |
| 27 | Graphics and Animation Part II - Understanding Graphics Contexts and Paths | 01:04:05 |
| 28 | Graphics and Animation Part III - Fundamentals of Animation and Basics Physics | 54:10 |
| 29 | Graphics and Animation Part IV - Parallax 3D Star Field and Working with Fonts | 47:33 |
| 30 | Rendering Bitmaps and Sprites: Understanding Bitmap Formats & Graphical Editors | 01:08:03 |
| 31 | Bitmaps and Sprites Part II - Building our Sprite Engine, Sprite Sheets and More | 01:08:43 |
| 32 | Bitmaps and Sprites Part III - Finishing our Sprite Engine & Advanced Animation | 59:02 |
| 33 | Hacking the Keyboard - More sprites, Animation Tools and User Control Schemes | 53:15 |
| 34 | Hacking the Keyboard Part II - Advanced Sprite Character Animation and Effects | 49:24 |
| 35 | Interfacing to the Mouse - Reading the Mouse Position, Buttons and Events | 53:41 |
| 36 | Interfacing to the Mouse Part II - Porting a 3D Game "Raiders-3D" with Mouse | 01:03:24 |
| 37 | Playing Sound FX and Music in JavaScript | 43:13 |
| 38 | Sound Design and Engineering - Adding sound FX and Music to Raiders 3D | 39:58 |
| 39 | Using ChatGPT & LLMs as Coding Assistants - Prompting, Code Generation and Demos | 01:10:52 |
| 40 | Demos of ChatGPT Generated Games - A Preview of What's Possible with ChatGPT/AI | 46:02 |
| 41 | Classic “Pong” Part I - Using Generative AI to Code a Version of "Pong" | 31:59 |
| 42 | Classic “Pong” Part II - Adding Code, Graphics, Sound and Music | 54:02 |
| 43 | Building “Breakout” Part I - Using Generative AI to Code a Version of "Breakout” | 25:10 |
| 44 | Building “Breakout’”Part II - Adding Code, Graphics, Sound and Music | 58:49 |
| 45 | Building “Flappy Bird” Part I - Using Generative AI to Code “Flappy Bird" | 30:33 |
| 46 | Building “Flappy Bird” Part II - Adding Code, Graphics, Sound and Music | 01:03:46 |
| 47 | Building “Snake” Part I - Using Generative AI to Code a Version of "Snake" | 22:59 |
| 48 | Building “Snake” Part II - Adding Code, Graphics, Sound and Music | 01:02:54 |
| 49 | Building "Space Invaders" Part I - Using Generative AI to Code "Space Invaders" | 37:02 |
| 50 | Building “Space Invaders” Part II - Adding Code, Graphics, Sound and Music | 01:14:28 |
| 51 | Building "Blackjack" Part I - Using Generative AI to Code "Blackjack" | 36:00 |
| 52 | Building “Blackjack” Part II - Adding Code, Graphics, Sound and Music | 35:39 |
| 53 | Retro Rift - Epilog and AI Musings - ChatGPT Builds its own Game | 22:21 |
| 54 | Using ChatGPT and Dall-e to Generate Pixel Art | 30:16 |
Similar courses to Fast and Furious Game Development with JavaScript and AI
ChatGPT Masterclass: 2023 Passive Income W/ ChatGPT and AIudemy
GraphQL for beginners with JavaScriptudemy
Build a ChatBot with Nuxt, TypeScript and the OpenAI Assistants APIzerotomastery.io
Creating a simple portfolio website with WebGL and Barba.jsawwwards.com
ChatGPT: Turning Anyone Into a Coderudemy
Data Structures & Algorithms - JavaScriptudemy
Full Stack Isomorphic JavaScript with Vue.js & Node.jsudemy
OpenAI Assistants with OpenAI Python APIudemy
