HTML Games (with JavaScript)

Games are a fun way to spend your time. They can be relaxing or exciting, even educational. Some are quite challenging and can be great problem-solving mental exercises. So, however you enjoy your games, creating and playing your own creations can be a great way to learn programming techniques.

A good way to “play” with some HTML JavaScript, and possibly enhance your (my) skill set.

• Learn some JavaScript basics from the MDN Web Docs “Getting started with the web” guide. This article was the basis for the “Hello” entry in the My Games section below.
• A simple HTML Game Example from W3 Schools.
• Game Canvas: Learn to use the HTML Canvas. It is great playing surface for games, but can be used for so much more. What can you do with it?
• HTML Game Tutorial from W3 Schools. Learn the basics of making your own games.
• Ultimate Guide to JavaScript Game Development: Best JavaScript Games and How to Code Your Own Plus a List of Useful Game Engines from Code Wizards HQ
• Game Development Tutorials by MDN Web Docs. This page contains multiple tutorial series that highlight different workflows for effectively creating different types of web games.
• How to build a game with HTML, CSS, and JavaScript: Tutorial for building a 2D jump game. Watch the video in the tutorial and follow the link for the code. Slightly different code from what is in the tutorial. Play the jump game.
• JavaScript and HTML snake game tutorial: Build a simple, interactive game (ToDo)
• How to Create A Snake Game in HTML CSS & JavaScript: Is this the same tutorial as the one above? (ToDo)
• Design Hit the Mouse Game using HTML, CSS and Vanilla Javascript: (ToDo)

Game collections

A great way to stoke your imagination for creating games is to explore the games created by others.

• HTML 5 Games is the definitive source for free games to be played in your mobile or stationary browser. It is also a high quality showcase of games you can feature on your own website. You can just place any game link for free on your site.
• Crazy Games - HTML5: These games are built using HTML5 to provide fun, challenging and free experience across any genre you can think of.
• HTML5 Games: Play the most wanted HTML5 Games free online! Single player or multiplayer? Choose from thousands of popular games directly and enjoy the fun!
• HTML Games: Play the best free online html and html5 games for mobile, tablet and desktop. Our games work on iOS (iPhone, iPad), Android and PC/Mac. Feel free to publish our html5 games on your site.
• HTML Games Unblocked: Play the best html5 games unblocked only on our site, we add only crazy games every day for you and your friends which you can play fully unlocked and spend an awesome time here.

My Games (with code)

• Hello is not a game but an example page showing Javascript interactivity using the Web Storage API. This is a simple, but cool, way to show how to store parameters for a page (game) locally and have the storage be persistent from session to session. See the Javascript Basics link above.
  • hello.md: page code.
  • hello.js: javascript code.