Long-time Phaser developer Emanuele Feronato has released the full source code to his Suika / Watermelon Phaser game. If you haven't seen it before, Suika is a Japanese puzzle game which combines elements of falling and merging puzzlers. It rose to glory recently with a series of games and apps using the same gameplay mechanic.

For $5 you get the full source code of the complete HTML5 "Watermelon Game" created using the Phaser 3.80.1 framework and Box2D physics engine powered by Planck.js, all written in TypeScript.

From the experience of more than 500 tutorials about Phaser framework, here is a complete Watermelon game which will make you learn game development using Phaser and TypeScript.

Studying and playing with this source code will allow you to learn on a real-world working example, covering, among other things, how to:

  • Install a webpack Phaser project with all dependencies.
  • Create a Phaser project.
  • Preload graphics, sounds and all needed assets.
  • Use bitmap fonts.
  • Place and move sprites on the screen.
  • Wait for player input and handle it.
  • Create animations using tweens.
  • Play sounds.
  • Recycle resources to save memory using object pooling.
  • Use particle to generate explosion effects.
  • Handle and save high scores and game data.
  • Use Box2D physics library.
  • Simulate a physics world.
  • Create physics circles.
  • Create physics boxes.
  • Create physics pentagons.
  • Detect collisions.
  • Render a Box2D world using Phaser sprites.

Learn HTML5 game development by studying a real-world example and use it to create your own chart-topping suika clone.

Buy the source code