Navigation

Part 4 - Choosing an Editor

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 <a href="http://scotch.io/bar-talk/best-of-sublime-text-3-features-plugins-and-settings">excellent guide</a> 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.

Intel XDK

intelxdk

The Intel XDK provides a development environment for creating hybrid mobile apps, including 2D HTML5 games. Special Intel XDK features for game developers include a game asset manager, game-related plug-in APIs, game samples and templates for supported game engines, autocompletion hints in the built-in code editor, and standard features available to app developers using the Intel XDK, such as packaging apps for different platforms.

The latest version of the Intel XDK includes a Phaser template built-in and easy ways to export to all the various app stores, so is well worth a look.

Visit the Intel XDK 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.

Visual Studio

This should only really be considered if you wish to write your game using TypeScript instead of JavaScript. Phaser has a TypeScript definitions file available. This allows you to use Microsofts new ES6 inspired language to develop in. It gives you access to a statically typed language, with traditional class inheritance, interfaces and most of the OO style trappings you may be used to from other languages like AS3 or Java.

The full version of Visual Studio varies in cost and Microsoft do great student details. Naturally it's only available for Windows.

Visit the Visual Studio 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.