
We create a static group of the ground pieces. As you may guess, static objects don’t move (ground, walls, various obstacles), while dynamic ones do the job (Mario, ships, missiles). There two types of objects: static and dynamic. It will look something like this: ) Ī group in Phaser 3 is a way to create a bunch of the objects you want to control together.

npm will ask you several questions about your project properties and then create a package.json file. We will use npm for building the project, so to start the project go to an empty folder and run npm init. I strongly recommend using nvm instead of installing node and npm manually it will save you a lot of time and nerves. Please note that the versions in the frontend world update extremely fast, so you simply take the latest stable versions. Thus we need to install node and npm.Īs I write this tutorial, I use node 10.13.0 and npm 6.4.1. However, as we want to use TypeScript, we have to set up the infrastructure to make the future development as fast as possible. If we were developing on JavaScript, we would be perfectly fine to start coding without all these preparation steps. As for me, I prefer developing pet projects in Emacs, therefore I have installed tide and followed the instructions to set it up.

You can always use plain old Notepad if you wish, but I would suggest using something more helpful. Preparing the environment IDEĬhoose your development environment.

It turned out that you need to do some boring stuff to make it all work, so I wrote this tutorial to help the other people like me get started faster. A while ago I wanted to have some fun and make a game in a browser I chose Phaser 3 as a framework (it looks quite popular these days) and TypeScript as a language (because I prefer static typing over dynamic). I’m a developer advocate and a backend developer, and my frontend development expertise is relatively weak.
