JavaScript Game Development Step by Step

Create 3 JavaScript games step by step in 1 course, learn animations and publish your games on free GitHub page.

4.20 (330 reviews)
Udemy
platform
English
language
Game Development
category
JavaScript Game Development Step by Step
3,863
students
7 hours
content
Apr 2018
last update
$54.99
regular price

What you will learn

Gain an in-depth understanding of HTML canvas

Create any type of animations in the HTML canvas using JavaScript

Build your own JavaScript games from Scratch

Learn to build games with external resources

Why take this course?

In this course you will learn about all the tools needed for creating casual games in JavaScript. In the first section you will learn about various components of JavaScript and HTML that would be required in game development.

In the succeeding sections you will create two games: Snake and Breakout step by step along with me. You will also learn about several other elements of the games that you can apply to your own game later on.

In the last section of the course you will also learn to publish your game online.

So, there's a lot to learn in this course and it will surely benefit you if you are planning to step into the world of JavaScript game development.

Content

Prerequisites of the Course

Prerequisites
How to get course repository and other stuff?

Introduction to Canvas and JavaScript

Overview of the Section
Introduction to Canvas
Drawing Elements in the Canvas
Canvas State
Introduction to JavaScript Objects
Drawing Objects in the Canvas
Introduction to JavaScript functions
Understanding the setInterval() function
User inputs & Event Handling
Test Your Skills

Building the Snake Game

Overview of the Section
Getting started with the Project
Declaring Objects of the Game
Initializing the Snake and Food
Drawing the Snake
Getting the user inputs
Updating Snake Position
Moving our Snake
Dealing with the boundary conditions
Drawing Food for the Snake
Snake eats Food - Part 1
Snake eats Food - Part 2
Adding Game Over condition - Part 1
Adding Game Over condition - Part 2
Adding Scoring to the Game
Initial Screen of the Game
Game is ready
Test Your Skills

Building the Breakout Game

Overview of the Section
Getting started with the Project
Declaring Objects of the Game
Drawing Ball and Base
Updating the Base position
Getting the user inputs
Moving the Base
Updating the Ball position
Collision between Base and Ball
Initializing the Enemy Tiles
Drawing the Enemy Tiles
Tile and Ball collision
Adding Scoring and Lives to the game
Adding Game Over condition
Basic Game ready
Increasing Game difficulty with time
Test Your Skills

More elements of the Game

A Short note
Tracking mouse movement
Building a Shooter - Part 1
Building a Shooter - Part 2
Adding Pause Screen to your Game
Adding Sound to your Game

Building Cupcake Catcher Game

Getting started with the Project
Loading the resources
Declaring Objects of the Game
Initializing the game
Drawing the tiles
Drawing the Catcher
Adding animation to the Catcher
Moving the Catcher
Learning the jump function
Adding jumping animation
Initializing the cupcakes
Drawing the cupcakes
Defining the collision functions
Using the food collisions
Learning about gravity
Adding levels and scoring
Game Over condition
Click to start or restart
Adding sound to the game
Adding Pause Screen to the game
Test Your Skills

Bonus - Publishing Your Game

How to publish your game in GitHub pages?

Screenshots

JavaScript Game Development Step by Step - Screenshot_01JavaScript Game Development Step by Step - Screenshot_02JavaScript Game Development Step by Step - Screenshot_03JavaScript Game Development Step by Step - Screenshot_04

Our review

🌟 **Overview of the Course** 🌟 The global course rating stands at a strong 4.20, with all recent reviews being positive. The course is highly recommended for those interested in JavaScript game development, especially beginners. It covers the basics well and provides step-by-step guidance on building games using the HTML5 Canvas. The instructor's approach to simplifying complex topics is commended by many learners. **Pros:** - 🎮 **Hands-On Learning**: The course offers practical experience in building simple yet effective HTML5 games, which is a valuable skill for JavaScript developers. - 🛠️ **Fundamental Skills**: It serves as a great introduction to game development for beginners, teaching fundamental skills and concepts. - 🤝 **Community Interaction**: Some reviewers have expressed their intention to share their completed projects with the community, indicating a supportive learning environment. - 💫 **Clear Instructions**: The instructions are praised for being clear and easy to follow, which is crucial for learners at any level. - 🚀 **Coverage of Basics**: The course teaches all the basics needed for casual game development, including how to build games from scratch. - 📚 **In-Depth Learning**: One learner specifically appreciated the detailed explanations of each line of code, which is a testament to the course's depth and comprehensiveness. - ✨ **Step by Step Tutorials**: The step-by-step game videos are highlighted as a significant learning aid. - 👍 **Positive Feedback**: Most reviews emphasize the course's effectiveness in teaching JavaScript game development, with several learners considering it the best course available on platforms like Udemy. **Cons:** - ⚠️ **Advanced Users May Find It Too Basic**: The course is targeted at beginners, and advanced users might find it too elementary for their skill level. - 🚫 **Inadequate Server-Side Content**: A few reviewers pointed out that there could be more content on server-side game development, which is a limitation for those looking to develop more complex games. - 🛠️ **Questionable Coding Practices**: There are concerns about the coding practices demonstrated in the course, such as the use of `var` instead of `let` or `const`, and placing CSS directly within the HTML. These might not adhere to modern JavaScript best practices. - 🎧 **Audio Quality Issues**: A significant and negative review criticizes the audio quality of the course recordings, suggesting that it could be uncomfortable to listen with headphones and requires playing the audio from speakers at a low volume. - 🚫 **Poor Code Organization**: Another negative review mentions issues with code duplication and the lack of efficiency due to a failure to refactor, which is a concern for those looking for professional and scalable solutions. **Additional Feedback:** - 🔬 **Quality Concerns**: The poor quality coding and production value mentioned in one review should be noted as a red flag for potential learners. It suggests that the course may not meet professional standards and could lead to frustration, especially for those experienced with JavaScript or programming best practices. - 📚 **Alternative Resources**: Learners who are already familiar with building simple HTML5 games might find this course too basic and should consider looking for more advanced resources to further their skills. In conclusion, this course is an excellent starting point for beginners interested in JavaScript game development. However, it may not be the best fit for experienced developers or those seeking a deeper dive into server-side game development. Learners are advised to weigh the positive aspects against the concerns regarding coding practices and audio quality before enrolling.

Charts

Price

JavaScript Game Development Step by Step - Price chart

Rating

JavaScript Game Development Step by Step - Ratings chart

Enrollment distribution

JavaScript Game Development Step by Step - Distribution chart
1591688
udemy ID
3/11/2018
course created date
7/7/2019
course indexed date
Bot
course submited by