Part 3 - Choosing an Editor

By Richard Davey on 14th February 2018   @photonstorm

You're going to need an editor in which to prepare your JavaScript code. There are many available, each with their own strengths and weaknesses. If you're an experienced developer you will probably already have your own preferred editor, in which case carry on to Part 5 of this guide. Otherwise here are some options for you:

Sublime Text

sublime

This is the editor the Phaser team use for building the framework and all projects. It's even the editor this guide is being written in. Sublime should be considered as an extremely powerful text editor rather than an IDE.

Features such as the ability to "Goto" anything, Split Editing, Multiple cursors, Distraction Free mode and loads of powerful Plugins make this the fastest and most versatile editor we've ever used in literally decades of development.

Using its comprehensive Package system you can enhance it in multiple ways. Here is an excellent guide to features and packages for Sublime.

The full version costs $70 but is worth every penny and is available for Windows, OS X and Linux.

Visit the Sublime Text web site.

Atom

Atom is a free cross-platform text editor from the team at GitHub. It's modern, approachable, yet hackable to the core. A tool you can customize to do anything but also use productively without ever touching a config file.

Visit the Atom web site.

Visual Studio Code

Visual Studio Code is a lightweight but powerful source code editor which runs on your desktop and is available for Windows, macOS and Linux. It comes with built-in support for JavaScript, TypeScript and Node.js and has a rich ecosystem of extensions for other languages (such as C++, C#, Java, Python, PHP, Go) and runtimes (such as .NET and Unity).

Visit the VS Code web site.

Brackets

Although primarily developed for building web site code, Brackets has really come into its own lately. It's a free open-source code editor and runs across Windows, OS X and Linux. It's actually written in JavaScript and is incredibly hackable, with new versions and extensions released every couple of weeks. It has a modern and dark UI, probably familiar to anyone who uses Adobe Creative Suite. Well worth considering, especially if you're after a free editor.

Visit the Brackets web site.

WebStorm

webstorm

JetBrains WebStorm is an extremely advanced full development environment. It goes well beyond simple code editing and offers all of the high-level features you'd expect from a proper IDE. Including code insight, npm built-in, code style and syntax reports, source control and a wealth of other features. Lots of the features are designed for web developers rather than game developers, but are still handy to have around.

It's based on IntelliJ IDEA, a heavily Java based editor, which is both a good and bad thing. For a start the actual code editing experience is nothing like as smooth and freeform as with Sublime, and the non-standard OS integration is weak. But the power features can often make up for that. Having errors with your code spotted for you, before you've even tested your game can be really useful. And code-completion is great too, although obviously somewhat limited by the myriad ways JavaScript can be written.

The full version starts from $49 and is available for Windows and OS X. There are often deals to be found on the JetBrains site too.

Visit the JetBrains WebStorm web site.