Skip to content

Latest commit



88 lines (63 loc) · 2.55 KB

File metadata and controls

88 lines (63 loc) · 2.55 KB
layout title date updated excerpt categories
Phaser Template
2018-01-20 11:11:17 -0800
2022-01-01 07:15:24 -0800
<p><a href="" target="_blank">Phaser Template</a> allows you to bootstrap Phaser games quickly. See the <a href="" target="_blank">demo</a> below.</p> <iframe src="" frameBorder="0" width="100%" height="520px"></iframe> <p>It's <em>open-source</em>. Feedback and contributions are welcome.</p> <p>What games are you planning to build using <a href="" target="_blank">Phaser Template</a>?</p>
phaser-template phaser template es6

TLDR;: Phaser Template allows you to create Phaser games quickly.

2021-12-20: Migrated Phaser Template to TypeScript.


Why did I create Phaser Template?

It was to scratch an itch because as a developer, I value:

  • the ease of building and releasing a game,
  • the maintainability and readability of the good code, and
  • the ability to learn something new while having fun.

I wanted to spend less time configuring and setting up the tools and more time creating the game. I built Phaser Template with that in mind.

Modern Syntax

Instead of the usual ES5 syntax:

var game = new Phaser.Game(800, 600, Phaser.AUTO, '', {
  preload: preload,
  create: create,
  update: update,

function preload() {
  // preload

function create() {
  // create

function update() {
  // update

You can use TypeScript with the latest syntax:

import Phaser from 'phaser';

class MyGame extends Phaser.Game {
  constructor() {
    super(800, 600, Phaser.AUTO, '');

  preload() {
    // preload

  create() {
    // create

  update() {
    // update

const game = new MyGame();


This template is built with Parcel and uses a GitHub Action to deploy to GitHub Pages.

I'd love to hear how you plan to use Phaser Template. Contributions are welcome!


<iframe src="" frameBorder="0" width="100%" height="520px"></iframe>