https://github.com/mr9d/wizard-of-the-code
I challenged myself to create a 2D game engine with HTML5 canvas and vanilla ES6 JavaScript, even though my professional expertise is far from game development.
https://github.com/mr9d/wizard-of-the-code
2d canvas css3 engine es6 game gh-pages html5 htmlacademy javascript sidescroller vercel
Last synced: about 1 month ago
JSON representation
I challenged myself to create a 2D game engine with HTML5 canvas and vanilla ES6 JavaScript, even though my professional expertise is far from game development.
- Host: GitHub
- URL: https://github.com/mr9d/wizard-of-the-code
- Owner: mr9d
- Created: 2019-10-15T15:13:22.000Z (over 6 years ago)
- Default Branch: master
- Last Pushed: 2022-11-15T07:33:33.000Z (over 3 years ago)
- Last Synced: 2025-05-21T20:12:11.288Z (about 1 year ago)
- Topics: 2d, canvas, css3, engine, es6, game, gh-pages, html5, htmlacademy, javascript, sidescroller, vercel
- Language: JavaScript
- Homepage: https://mr9d.github.io/wizard-of-the-code/
- Size: 115 KB
- Stars: 4
- Watchers: 2
- Forks: 0
- Open Issues: 0
-
Metadata Files:
- Readme: README.md
Awesome Lists containing this project
README
# HTML canvas 2D game engine
## About
I challenged myself to create a 2D game engine with HTML5 canvas and vanilla ES6 JavaScript, even though my professional expertise is far from game development. The goal was to practice with HTML5 canvas, and JavaScript and implement some 2D games technics I heard some time ago.
Fun fact. This project was inspired by [the Code and Magic](https://github.com/htmlacademy/code-and-magic-demo) demo project from the JavaScript course of [HTMLacademy](https://htmlacademy.ru/) which I worked with as a mentor.
## Live version
Available at GitHub pages:
Also available on Vercel:
Both deployed from the `master` branch.
## Running locally
If you want to run the application locally, you can do the following:
- `git clone` the repository
- Open `index.html` in the browser
That’s it, no build required.
## How to play
### Goal
The game has no objective. If you need a challenge, you can find the second flag marker at the top of the tower.
### Controls
Left/Right – move.
Alt – jump.
Ctrl – fire (not implemented yet).
### Level
You can change the game level in any way by modifying the [script/game/level.js](/script/game/level.js) file.
## Used technologies
- HTML5 + Canvas API ([documentation](https://developer.mozilla.org/en-US/docs/Web/API/Canvas_API))
- CSS3
- JavaScript ES6
- GitHub Pages ([documentation](https://docs.github.com/en/pages))
- Vercel ([documentation](https://vercel.com/docs))