make-web-game v0.3.1

Generates a template to make a 2D browser game using PixiJS and TypeScript.

:sparkles: Features

• Full TypeScript support
• Game loop using MainLoop.js
• Simple scene management
• Keyboard input
• Separate web app to develop features in isolation
• Web worker
• Auto-pause when window loses focus
• Reactive state management - trigger functions when state changes
• Visual effects like fade-in and blink
• Debug panel to inspect your scene
• Sprite management using aseprite
• Sound management
• Main menu
• Type-safe local storage
• Very fast dev server using vite
• Github actions workflow to deploy to itch.io
• Code formatting with prettier

Dependencies included

Rendering and game logic

• :tv: PixiJS

• :up: pixi-ex*

• :pill: valtio

• :loop: mainloop

• :tropical_drink: juice.js*

• :one: level1*

• :sound: howler

Tooling

• :m: typescript

• :zap: vite

• :nail_care: prettier

• :chart: sentry

• :straight_ruler: vitest

• :eyes: nano-panel*

• :red_circle: GitHub actions workflows

• :recycle: plop

* = made by me

How to use

npx make-web-game@latest <game-name>

Usage with npx ensures that you are always using the latest version

make-web-game will do the following:

• Create a new folder called <game-name>
• Copy all template files to that folder
• Install the dependencies
• Create an initial commit

Example usage

npx make-web-game my-game

What you should do after the script is run

• Update the itch.io project name in .github/workflows/release.yml on line 69.

• Add your itch.io API key to your Github project secrets

• Set Sentry DSN in src/index.ts at line 25.

Template docs

Docs

Showcase

A list of games bootstrapped using this tool:

• Diablito A very tiny roguelike

Requirements

• git >=v2.28.0