loading...
Cover image for Gaming JavaScript

Gaming JavaScript

kayis profile image K ・2 min read

Image by David Werner on Flickr

So you're somehow ended up being a web-developer and coding JavaScript and year after year you learn that JavaScript can do more and more. What you used to create blinking texts for your counter strike clan page is now able to make full fledged servers via Node.js or native mobile apps via React-Native.

But if you're a bit like me, you probably dreamed about doing game development before you made mad bucks with old boring apps. Wouldn't it be nice if you could create your very own games with the JavaScript skills you already have? Rest assured, for there are a bunch of game engines out there that allow you exactly this!

Phaser

One of the better known contenders in the field of 2D game engines for the browser. Very code heavy but you'll definitely feel at home, if this is your jam. It just released a complete rewrite with version 3.

Crafty

Another 2D engine and the one I started game development with. It's a bit smaller and with it's entity component system more opinionated than Phaser, but I think it's a solid foundation too. It released it a new version this month too.

React Game Kit

A lesser known contender, also 2D, that helps you to create games with React. It offers basic concepts like a game loop or stages. It also works with React-Native, which makes native mobile games possible. Probably not suited for bigger projects, but certainly a simple way for React devs to get something running quickly.

BabylonJS

This time a 3D engine that works with the power of WebGL, WebVR and WebAudio. If you're not the 2D type, but also want to keep things inside the browser. As the other engines I mentioned here, it's more coding heavy than major engines, but if you aren't into big things like the Unreal Engine (C++) or Unity (C#), Babylon is the way to go.

Conclusion

There are way more engines based on JavaScript out there and some even allow you to build games as nativish apps. Personally I prefer to control much of the code on my own, which reflects in the engines I listed here, but some also come with graphical editors. So if you're a JavaScript pro and want to make games, don't hold back!

Posted on by:

kayis profile

K

@kayis

Taking care of developer relations at Moesif and creating educational content at fllstck.dev

Discussion

markdown guide
 

The new Cocos Creator engine is also pretty great and supports typescript wonderfully!

 

Nice, Phaser also supports TypeScript.

 

Just a comment in order to share a word about CreateJS: createjs.com/

Its creators, GSkinner, made really cool things with it: gskinner.com/showcase

And don't forget the possibility to do those things yourself with WebGL/Canvas and the others available API.

 

Phaser is cool, I used it in one of my projects when I was putting together a portfolio to get me my first Dev job. I'd recommend it at any level of JS/programming competency.

Here's what I made:

ufofs.herokuapp.com/

It's a very simple game that didn't take too long to make, but it shows the kind of cool thing you can build. It even has support for mobile/touch based interfaces.

 

Unity Game Engine also supports a JavaScript syntax.

 

It's a JavaScript-like syntax, as opposed to JavaScript run on a JavaScript engine. A familiarity with JS means that you can pick up their script very quickly by referencing their API docs.

It should be noted that Unity is a proprietary engine and the specifications can change at the whim of Unity. The positives are that it comes with a Rich IDE/modelling tool where you can create objects and environments.

As noted by Michael, it's being deprecated this year so maybe best to avoid. :(

 

Nice!
Could you elaborate? :D

 

A lot of people like to call UnityScript by the name "JavaScript." I believe this is wrong on several levels.

While "JavaScript" could refer to any one of the ECMAScript specs, Unity's ".js" language doesn't even come close to conforming to that specification — nor does it try to. UnityScript is a proprietary language, and it doesn't follow any concrete specification; it is modified at the will of the Unity developers.
The vast majority of JavaScript libraries you find will not work just by copying them into Unity. Unity's "JavaScript" is most similar to Microsoft's JScript.NET, although it is not quite identical.

  • JS is class-free, UnityScript have them, and that once defined are fixed for the duration of the runtime.
  • File name matters in UnityScript, where most files represent a single class.
  • UnityScript supports .NET OOP features like classes,"protection levels" (public, private, protected) and "static" keyword options. Since it also supports explicit typing, it also has support for "generics" (runtime type enforcement), which JavaScript has no notion of.
  • And unlike the popularity of Javascript, UnityScript should be buried deep and nobody should be allowed to use it, at all.
 

Actually UnityScript, Unity flavor of Javascript that have types, is deprecated, and will be removed this year from the Engine. Unfortunately.

 
 

K, are you creating a game yourself or are you involved somehow in something game related? Your profile says 'mobile consultant', a mobile game perhaps?

 

I created a few small games as a hobby (Web based). Didn't try myself on "professional" game development tho :D

 

Do you want to? Hobby or professional either way.

Yes, it's more a quesion of time than want haha

Yes you want to but you do not have time for a game related project?

yes, pretty much that

 

Really funny example of MMO based on VueJS, HTML/CSS and NodeJS - twitter.com/vovchisko/status/11052...

 

I like PhaserJS, it's simple and funny to make games!

 

Oooh! Babylon looks fun! Currently have a few Phaser projects going though... maybe I should finish up one or two of tho... ooh look! A 3D rendering of a deserted house! 3demo.giroptic.io/

 

:D

started 10
finished -2

 

I would like to mention Godot Engine it also make use of JavaScript for HTML5 exports. Leaning curve is decent and they recently release 3.0