Cademy logoCademy Marketplace

Course Images

Web Games with JavaScript - Create Your Own 5 Fun Word Games

Web Games with JavaScript - Create Your Own 5 Fun Word Games

  • 30 Day Money Back Guarantee
  • Completion Certificate
  • 24/7 Technical Support

Highlights

  • On-Demand course

  • 8 hours 26 minutes

  • All levels

Description

This course is designed to help you master the concepts of JavaScript needed to create interactive web games. You will create five interesting word games that will teach you how to write and test the game code in JavaScript.

This is a full-practical course to learn how to make online games using JavaScript. First, you will learn to create a word scramble game where the user has to solve the scrambled word with as few wrong guesses as possible. Here, you will learn how to load dynamic word lists to create an interactive experience. Then you will learn to create a word decode game where the user has to solve a phrase using the number codes. Here, you will learn how to associate every letter with a number and dynamically load words and phrases. Your third game will be a hangman game where the user has to guess the hidden phrases by clicking the available letters. Here, you will use JavaScript conditions to check the guesses made by the user. Next, you will learn to build a word search game to understand how to create a fully functional word search that fills the dynamic grid automatically with as many words as possible. Finally, you will build your last game, a simple quiz game that gets dynamically generated with JavaScript and creates all the Document Object Model (DOM) elements and interactions depending on the JSON data. By the end of this course, you will have the skills and confidence to build your own web games in JavaScript. All resources and code files to the course are placed here: https://github.com/PacktPublishing/Web-Games-with-JavaScript---Create-your-own-5-Fun-Word-Games

What You Will Learn

Find out how to set up and prepare game-board
Create a dynamic and flexible game to play
Use Array methods, such as a map, to shorten the code
Discover techniques to add and update player score
Create interactive player elements with JavaScript Document Object Model (DOM) elements
Test and debug the games

Audience

This course is for game designers, game developers, Java programmers, coders, who wants to learn how to make web games in JavaScript. A basic understanding of HTML, CSS, and JavaScript is needed to get started with this course.

Approach

In this course, you will learn to build five interactive games to understand how JavaScript supports the development of web games.

Key Features

Get to grips with the concepts of JavaScript * Learn the elements of game design needed to create a fully functional game * Get ready to create five interactive web games using JavaScript

Github Repo

https://github.com/PacktPublishing/HTML5-Canvas-Element

About the Author

Laurence Svekis

Laurence Svekis is an experienced web application developer. He has worked on multiple enterprise-level applications, hundreds of websites, business solutions, and many unique and innovative web applications. He has expertise in HTML, CSS, JavaScript, jQuery, Bootstrap, PHP, and MySQL and is also passionate about web technologies, web application development, programming, and online marketing with a strong focus on social media and SEO. He is always willing to help his students experience what technology has to offer and looks forward to sharing his knowledge and experiences with the world.

Course Outline

1. Word Game Introduction

1. Introduction to the Word Scramble Game from Scratch

This video provides an introduction to the word scramble game from scratch.


2. Creating a Word Scramble Game Using JavaScript

1. Introduction to the Word Scramble Game from Scratch

This video provides an introduction to the word scramble game from scratch.

2. Setting up and Preparing your Game Environment Using HTML and Cascading Style Sheets (CSS)

This video explains how to set up and prepare your game environment using HTML and CSS.

3. Setting up Game Values

This video demonstrates how to set up game values.

4. Adding and Setting up the Word Game

This video explains how to add and set up the word game.

5. Scrambling Letters with JavaScript Random Array values

This video demonstrates how to scramble letters with JavaScript random array values.

6. Updating and Adding Content to Web Pages

This video explains how to update and add content to web pages.

7. Counting Letters in a String with JavaScript Letter Counter

This video demonstrates how to count letters in a string with JavaScript letter counter.

8. Adding Scoring and Gameplay to your Game with JavaScript

This video explains how to add scoring and gameplay to your game using JavaScript.

9. Final Scrambler Game Tweaks

This video demonstrates how to make some final tweaks to the scrambler game.

10. Reviewing the Scramble Letters Game

This video explains how to review the scramble letters game.

11. Adding a Dynamic Word List from Google Sheets to your Game

This video demonstrates how to add a dynamic word list from Google Sheets to your game.

12. Selecting Multiple Word Lists from Dynamic Content

This video explains how to select multiple word lists from the dynamic content.

13. Gameplay Bug Fixes List.

This video introduces you to gameplay bug fixes list.


3. Uncovering the Secret Words Using JavaScript Number Values

1. Introduction to the Secret Words Number Decoder Game Using JavaScript

This video introduces you to the secret words number decoder game using JavaScript.

2. Setting up a Game Board

This video demonstrates how to set up a game board.

3. Creating Interaction for the Player

This video explains how to create interaction for the player.

4. Setting up Gameplay and Setting Coded Values

This video highlights the concept of gameplay and explains how to set coded values.

5. Providing the Player Messages Output Code

This video focuses on how to provide the player messages output code.

6. Using Array Methods

This video demonstrates how to use the various array methods.

7. Making a JavaScript Word Decoder

This video explains how to make a JavaScript word decoder.

8. Setting up and Starting the Game Setup

This video demonstrates how to set up the game and how to start it.

9. Game Flow

This video introduces you to the game flow.

10. Creating Player Interaction Inputs

This video explains how to create player interaction inputs.

11. Adjusting and Tweaking the Game

This video demonstrates how to adjust and tweak the game.

12. Setting up the Winner Game

This video explains how to set up the winner game.

13. Debugging and Adding Final Game Tweaks and Improvements

This video explains how to debug and add the final game tweaks and improvements.

14. Conclusion to Number to Letters Game

This video provides the conclusion of numbers to the letters game

15. Reviewing the Code for the Game

This video explains how to review the code for the game.


4. Hangman Word Guessing Game from Scratch Using JavaScript

1. Introduction to the JavaScript Hangman Game

This video provides an introduction to the Hangman game.

2. Setting up JavaScript Hangman Game Board

This video explains how to set up a JavaScript Hangman game board.

3. Launching Application Content when Document Object Model (DOM) loads the DomContentLoaded Event

This video demonstrates how to launch application content when DOM loads the DomContentLoaded event.

4. Creating a Gameplay in JavaScript.

This video explains how to create a gameplay in JavaScript.

5. Creating a Game Start and the Game Setup

This video explains how to create a game start and focuses on the game setup.

6. Setting up and Building Game Build Player Letters

This video demonstrates how to set up and build a game.

7. Checking the Correct Guess

This video explains how to check the correct guess.

8. Updating the Player Elements and the Document Object Model (DOM) Values

This video demonstrates how to update the player elements and the DOM values.

9. Adding Score and Player Score Conditions

This video explains how to add a score and player score conditions.

10. Setting Conditions for Winning the Game

This video demonstrates how to set conditions for winning the game.

11. Final Code Review

This video provides the final code review.


5. JavaScript Word Search Game from Scratch

1. Creating a Dynamic JavaScript Word Search Game from Scratch

This video demonstrates how to create a dynamic JavaScript word search game from scratch.

2. Setting up a Word Search Board with JavaScript

This video explains how to set up a word search board with JavaScript.

3. Adding Game Elements to a Page Using the document.createElement() Method

This video demonstrates how to add game elements to a page using the document.createElement() method.

4. Generating Game Values and Setting up the Grid

This video explains how to generate game values and set up the grid.

5. Adding Words to the Grid for the JavaScript Word Search Game

This video demonstrates how to add words to the grid for the JavaScript word search game.

6. Applying Game Logic in JavaScript to Check for Existing Letters

This video explains how to apply game logic in JavaScript for existing letters.

7. Adding Words Vertically to the Word Search Grid

This video demonstrates how to add words vertically to the word search grid.

8. Filling Game Letters Automatically to Populate and Build the Word Search Board

This video explains how to fill game letters automatically to populate and build the word search board.

9. Adding a Player Word List to Guide the Player

This video demonstrates how to add a player word list to guide the player.

10. JavaScript Game Review with Game Tweaks and Adjustments

This video provides a review of the JavaScript game, highlighting certain game tweaks and adjustments.

11. Adding Player Experience

This video demonstrates how to add player experience.

12. Applying Win Conditions

This video explains how to apply the win conditions.

13. JavaScript Word Search Game - Final Game Tweaks

This video demonstrates how to add the final game tweaks to the JavaScript word search game.

14. Final Word Search Game - Code Review and Explanations

This video provides the final code review and explanations for the word search game.


6. Creating a Dynamic Quiz with JavaScript JSON Data

1. Creating Dynamic Data for the JavaScript Quiz

This video explains how to create a dynamic data for the JavaScript quiz.

2. Setting up Quiz Files and Source HTML Setup Development Environment Files

This video demonstrates how to set up quiz files and source HTML development environment files.

3. Creating a JSON Data File for your Quiz Using Ajax to Fetch JSON Data

This video explains how to create a JSON data file for your quiz using Ajax to fetch JSON data.

4. Creating Quiz Questions within the JSON file for the JavaScript Quiz Game

This video demonstrates how to create quiz questions within the JSON file for the JavaScript quiz game.

5. Using JavaScript to Generate and Show questions to the Player

This video focuses on how to generate and show question to the player.

6. Showing Quiz Questions with JavaScript

This video explains how to show quiz questions with JavaScript.

7. Adding Event Listeners to the Game

This video explains how to add event listeners to the game.

8. Moving to the Next Question

This video demonstrates how to move to the next question.

9. Adding Scoring for Quiz Game

This video explains how to add scoring for quiz game.

10. Final Quiz Game Tweaks

This video demonstrates how to make some final tweaks to the quiz game.

Course Content

  1. Web Games with JavaScript - Create Your Own 5 Fun Word Games

About The Provider

Packt
Packt
Birmingham
Founded in 2004 in Birmingham, UK, Packt’s mission is to help the world put software to work in new ways, through the delivery of effective learning and i...
Read more about Packt

Tags

Reviews