Udemy
    •  
    •  
    •  
    •  
    •  
    •  
    •  
    •  
Subscribe
Turn what you know into an opportunity and reach millions around the world.
Learn More
Your cart is empty.
Keep shopping
Short course on HTML5, CSS3 and Javascript in a game
Rating: 4.4 out of 5(21 ratings)
2,325 students

Short course on HTML5, CSS3 and Javascript in a game

Learn javascript theory and apply HTML5, CSS3 and Javascript to develop a game
Created bySalvatore Aetos
Last updated 10/2023
English

What you'll learn

  • At the end of the course you will have great skills set like HTML5, CSS3 and Javascript
  • You will be able to build projects using HTML, CSS3 and Javascript to develop games
  • You will learn to apply the theoretical aspects of Javascript into real life project.
  • Learn Event Handlers and DOM manipulation in a project
  • Set time out and Set interval in a project

Course content

1 section • 10 lectures • 1h 57m total length

  • Introduction1:39
  • HTML structure game10:51
  • CSS styling game 111:57
  • CSS styling game 27:20
  • CSS styling game 317:38
  • Javascript pop out functionality19:29
  • Javascript start to finish skeleton game13:40
  • Start game and movement of objects animated7:40

    Start the game with the start button, use click event listeners to increase the score by clicking stars, and temporarily swap star images while moles respond to clicks.

  • Score system and animation improvement6:30

    Improve the game by adding a scoreboard that updates on clicks, ensure reset with an arrow function binding, and use pointer events to allow one hit per round.

  • High Score functionality20:52

Requirements

  • Basic knowledge of HTML and CSS (No prior knowledge is also okay as it is explained in detail)

Description

If you want to start learning Javascript or to apply HTML5, CSS3 and Javascript in a project to program or you already have some basic knowledge, then you are in the right place. This course gives you a chance to take your knowledge to the next level. You will start from very basics and learn to apply the skills in two different projects (Quiz and Game).


This is a fun, practical & project based course for all skill levels. The projects in this course are designed to get you building things using HTML5, CSS & JavaScript with no frameworks or libraries. Every project is built from scratch and has some kind of dynamic functionality.


There are projects designed for you to complete in a few hours.

You should have some basic knowledge of HTML/CSS/JS. If you are brand new, this course is a mix of both with emphasis on Javascript theory and building two projects. The projects are end to end product.


project is Whack a Mole game. The following skills you will learn to implement in the project: 

Learn about ES6 syntax

Event listeners

How to control CSS styles and classes with JavaScript

What's the difference between setTimeout and setInterval

How to use clearInterval, difference between const and let variables

Regular JavaScript functions and ES6 arrow functions and much more.

Create a plugin that tracks, updates and stores high score. We will also talk about logical operators in JavaScript (OR/AND/NOT) and other fundamental vanilla JavaScript techniques and principles that are useful not only for games, but also for building websites, generative art

JavaScript DOM manipulation (build a simple game add-on that keeps track of high score)

Learn local storage browser objects and it's associated JavaScript methods.


The projects will help you better understand how JavaScript works, use these skills to level up as a Front end web developer and get one step closer to getting hired for your first coding job. Also, it is a good stepping stone before you start learning React, React native and Next.js

Who this course is for:

  • Students who want to learn HTML5, CSS3 and Javascript
  • Students who want to create projects and develop using HTML5, CSS3 and Javascript

Report abuse