As a computer science student with an active interest in web development, it’s about time I learned how to program with JavaScript. JavaScript is one of the major languages used for websites, alongside HTML and CSS. It is supported by every modern site, and is used by almost all of them.

I already had plenty of experience with HTML and CSS, but almost none with JavaScript. There are a couple reasons for this, one being that the websites I worked on had little to no JavaScript at all, let alone any that needed to be changed. The other reason is that the need to learn it simply never came up. I enjoy learning things in my free time, but I had heard many a horror story about using JS, and as such was in no rush to learn it.

But then, as it happens, the opportunity to learn it came up. For my current Computer Science course, our over-the-block projects were to design a web application. “Hey,” I thought to myself. “This is the opportunity to learn and build something with JavaScript, and you really should learn it sooner rather than later.” Since I had no idea whatsoever what to build for the web, I figured I might as well default to making a game. I had already made some pixel images for a spaceship game my friend was working on, so why not make a similar Galaga-type game?

I decided to look for a framework or library that would make the whole process easier, and JS has a LOT of those. I ended up going with a beta framework that was specifically designed to help make games with JS.

CraftyJS

CraftyJS is in active development, and all of the code for it can be found on their Github. They actually released a new beta version about 2 weeks ago. I chose it because it looked intuitive and easy to use, even for someone with no prior JS experience. Turns out I was right – it is fairly intuitive. There are, however, some drawbacks and challenges that I faced during the creation of this project.

Problems with JavaScript

JavaScript is an interpreted language, meaning it has no compiler, but also meaning that it will always run, no matter how horribly broken the code is. To quote W3Schools, “Normally, errors will happen, every time you try to write some new JavaScript code.” This makes debugging more difficult, as one tiny change can make nothing show up on your webpage, and without the kind of error throwing and debugging tools that exist for compiled languages, it can be difficult to find the problem. Less obvious errors might go completely unnoticed by developers for long periods of time.

Because JS is such a popular language, though, not all is lost. Tools like JSLint and JSHint can help in resolving errors and adhering to conventional formatting (though JSLint is a little too strict about some conventions, in my personal opinion), and IDEs like WebStorm will catch syntactic errors and provides support for other libraries and frameworks. It is still a step more difficult to debug than compiled languages, though. It is no surprise why there are so many frameworks and libraries that exist to solve many of its annoying quirks.

The Good of CraftyJS

By far the best things about Crafty besides its general ease of use is its documentation. It is well-written, and best of all, it provides examples of how to use it. There are multiple demos on the website whose code is also on GitHub, which was useful for some problem-solving when the documentation was insufficient. Overall, I’ve found Crafty’s simplicity to be a great and pretty fun thing to use, which is not what I expected at all.

Problems with Crafty

Even though its demo code is on GitHub and it has great documentation, Crafty otherwise has a pretty small community. This means it’s harder to find help for specific issues. Additionally, a recent issue has come up where directional keys don’t work in the newest version of Firefox, so I will have to come up with a workaround. However, I have been able to work through every other issue or challenge I’ve faced thanks mostly to Crafty’s great documentation, which will point out potential issues and how to solve them (ex. “the shared object trap“).

I will post a link to the working version of the game and my final thoughts once it’s completed, though you can see the in-progress code on my GitHub.