Interactive ESM Template
  • 14 Oct 2024
  • 1 Minute to read

Interactive ESM Template


Article summary

The ShuffleGame template is a fun example of how to write a large interactive brain-twister-game to show off what can be achieved in a HTML template.

  1. The game has two modes. One where the goal is to move the red tile to a highlighed area on the board and the other, a number-sorting game, where the goal is to end up with the numbered tiles ordered and the blank space in the lower right cell.
  2. The code-design is strictly Object Oriented.
  3. In modern browsers, (e.g. Chrome 61+), the template can be hosted without bundling, but we are WebPack'ing it with with a generic webpack_config.js which can be re-used for any template. It outputs to "template.js" which is the same as TS-bundling would do for a classic (namespaced, non-module) template. This means the same script can be used for zip'ing both.

Was this article helpful?

What's Next
Changing your password will log you out immediately. Use the new password to log back in.
First name must have atleast 2 characters. Numbers and special characters are not allowed.
Last name must have atleast 1 characters. Numbers and special characters are not allowed.
Enter a valid email
Enter a valid password
Your profile has been successfully updated.