Phaser Template

Jan 20, 2018HomeEdit

TLDR; Phaser Template is a boilerplate for getting Phaser games up and running.


Why did I create Phaser Template?

It was to scratch a personal itch. As a game developer, I value the following:

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

This meant I wanted to spend less time configuring and setting up the tools and more time creating the game. I built Phaser Template to solve that problem.

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 ES6 syntax instead:

import { Game, AUTO } from 'phaser';

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

  preload() {
    // preload

  create() {
    // create

  update() {
    // update

const game = new MyGame();


The template is built on top of web-app-template, which is a stripped down version of create-react-app. (This is where the nice development/production configuration comes from.) In terms of deploying, it’s using gitploy to deploy to GitHub Pages.

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