JavaScript Game Create a flying bird game fun learn DOM

Use JavaScript connect with Elements and create a game while practicing learning JavaScript and Document Object Model

3.90 (22 reviews)
Udemy
platform
English
language
Web Development
category
instructor
4,060
students
1.5 hours
content
Nov 2019
last update
$44.99
regular price

What you will learn

How to use JavaScript

How to create elements dynamically

Manipulate elements using JavaScript

Explore JavaScript Document Object Model

Description

Fun and exciting way to practice JavaScript while building an interactive game from scratch.

Learn how to apply JavaScript - connect to elements - update and manipulate element content and attributes - create interaction with event listeners - create content dynamically - all done in a step by step format so you can learn explore and create your own version of the game.  Apply what you learn to your JavaScript projects to master working with the DOM.

Explore how you can apply JavaScript to :

  • Select elements from the web page

  • Create global variables and objects to use for game play

  • Add event listeners to create interactive content

  • Listen for keypress and apply the results in your code

  • Add classes and remove classes from elements

  • Create elements dynamically on the fly with JavaScript

  • Append new elements to existing webpage elements

  • Use offset values of elements within code

  • Update element style values to produce animation

  • Use of awesome JavaScript methods like getBoundingClientRect()

  • Smooth animations with requestAnimationFrame()

  • Check for element overlap and collision detection

  • How to build your game to be dynamic with flexible variables

  • and much more.

Source Code is included so you can try it for yourself, what is covered in the lessons.

No libraries, no shortcuts just learning JavaScript making it DYNAMIC and INTERACTIVE web application.

Step by step learning with all steps included.

Beginner JavaScript knowledge is required as the course covers only JavaScript relevant to the building of the game.  Also HTML and CSS knowledge is essential as scope of this course is all JavaScript focused.  

Taught by a professional instructor with over 18 years of experience ready to help you learn.

Along with friendly support in the Q&A to help you learn and answer any questions you may have.

Try it now you have nothing to lose, comes with a 30 day money back guarantee.  

Start building your own version of the game today!!!!

Content

Introduction to JavaScript building a Flying bird game from scratch

Flying Bird Game Introduction
HTML CSS and JavaScript - Game Setup Structure
Source Code
Add Event Listeners - JavaScript element interaction
Source Code
Keyboard event tracking - JavaScript KeyPress Events
Source Code
Add element to page - JavaScript Create Elements - createElement Method
Source Code
JavaScript RequestAnimationFrame
Source Code
Move Conditions - JavaScript Game logic
Source Code
Wing Movements - Boolean values JavaScript
Source Code
Scoring and gravity - JavaScript game enhancements
Source Code
Game End Conditions - Game over with JavaScript
Source Code
Create Obstacles - Element creation using JavaScript
Source Code
Moving Obstacles - Select Element and update style properties JavaScript
Source Code
Checking Collision Detection - JavaScript element properties check
Source Code
Handle Game Over on collision
Game Code Review - Review game source code HTML CSS and JavaScript
Bonus Add Color - Generate random color value JavaScript
Source Code and Download

Bonus content and next steps

Bonus Lecture

Screenshots

JavaScript Game Create a  flying bird game fun learn DOM - Screenshot_01JavaScript Game Create a  flying bird game fun learn DOM - Screenshot_02JavaScript Game Create a  flying bird game fun learn DOM - Screenshot_03JavaScript Game Create a  flying bird game fun learn DOM - Screenshot_04

Reviews

Owen
February 4, 2019
This really opened up my eyes to how versatile Javascript really is and has given me a greater appreciation for working with Javascript. The course was a perfect way to illustrate this.

Charts

Price

JavaScript Game Create a  flying bird game fun learn DOM - Price chart

Rating

JavaScript Game Create a  flying bird game fun learn DOM - Ratings chart

Enrollment distribution

JavaScript Game Create a  flying bird game fun learn DOM - Distribution chart

Related Topics

2155396
udemy ID
1/16/2019
course created date
6/17/2019
course indexed date
Bot
course submited by