Trigger.io

I’ve written mobile apps in the past, but only simple toys like an RSS reader, a Tamagotchi, and an app that tells you how much your meeting has cost. I enjoy Java, but I found writing these Android apps laborious and finicky, particularly using the cumbersome (although powerful) hulk that is Eclipse. I was recently tinkering in jQuery mobile which was great for rapid development, but how to get the resulting app onto a device? I asked around the Box UK office, and perennial tinkerer Steve Anderson made the suggestion of Trigger.io, so I gave it a go!

What is it?

Trigger.io is a multiplatform tool for converting HTML5/JavaScript into applications for Android, iOS, Chrome, Firefox and Windows mobile devices. It is similar to PhoneGap, Sencha, and Appcelerator, but claims to be faster and better.

Getting to grips

After a signup stage on the Trigger.io site (yes, you need an account, but free ones are available), it installed no problem at all, it just runs as a Python script through a single command which kicks off a web-based tool called Forge:

Starting Trigger.io from the console

Starting Trigger.io from the console

It opened the web server in Chrome automatically:

Trigger.io running on a laptop

Home screen of Trigger.io running on my laptop

Clicking “create” simply showed me a dialog and all I had to enter was my app name and it set up a skeleton project for me.

Create a new app

Creating a new app

It then went on to a “preparing your app” screen. Occasionally, at this point, an error would be raised – it seems that Forge does a lot of pulling code and templates from servers to get you the latest project template. I found that on the rare occasions that happened, running it again sorted the problem. My home broadband is pretty sketchy at the best of times so I gave Forge the benefit of the doubt.

The skeleton app simply contained a /src directory with an HTML file, jQuery mobile and a bit of CSS. In Trigger.io, you are free to use whatever JavaScript library you want to build your app!

From there, I had the option to run my app, or even package it up for distribution – this really is great, such a simple workflow to be able to just use a web browser for this stuff! I deployed to Android. There was a slight hiccup whereby I had to tell it where the SDK was, and I had to do that on a per-project level, which seems a bit clumsy (I’d like to set a global default), but that was just a case of editing local-config.json in my project root.

No Android SDK found on system

Uh oh, better tell local-config.json where the ‘Droid SDK is…

Once that was done, I just hit “run again”, then it asked me for a device, I selected “Attempt to automatically launch the Android emulator” and in a matter of flipping ages the emulator was up and running!

(The delay is not Trigger.io’s fault – the ‘Droid emulator is full emulation, rather than a simulator like in the iOS ecosystem, and it tends to take a while to start up first time. My bro tip is not to stop the emulator once it’s running, just redeploy your app.)

Sample app up and running

Sample app, up and running

OK, I thought, but where’s the kicker? Where’s the heavyweight IDE? Well, as it turns out, I could use whatever I want. I took a look at the source code. Simple HTML and JavaScript – this looks perfect! No lock in to any particular IDE/editor. I tried Netbeans, Sublime2 and trusty old Vim whilst trying this out – it doesn’t matter what you use, which is a massive plus!

Going deeper

The next thing to do was to put one of my own apps in there. I dropped in the jQuery mobile site that I’d built and I was surprised to find that it worked straight away! I simply brought the HTML and JavaScript across to the Trigger.io project, deployed to my Nexus 7, and it worked, and was an app! It’s going to take me a while to calm down about how easy this was!

I didn’t want to get too ahead of myself, though – this was just a dumb mockup. I tinkered with the Ajax functionality provided by Trigger.io’s Forge platform and that all seemed to work. I needed a fresh challenge so when my girlfriend suggested making an app for kitties, I decided to build it as a toy project. I recalled the Duck shoot game I wrote for the clean code blog post and built a simple “pat the dot and it spawns other dots” toy in pure JavaScript. What I found extremely useful was that I could just use my web browser to test the game – I didn’t need to keep pushing it to my tablet or the emulator. This sped up my development efforts an immense amount as it was a much shorter code-to-test cycle. I self-signed and compiled the game into an .apk and sent it to my girlfriend and it installed first time on her Samsung Galaxy II, which was a pleasant surprise – I didn’t expect it to work so smoothly!

Soft paws running in Chrome

Soft Paws running in Chrome

The only library I used was hammer.js, a jQuery plugin that does a fantastic job of recognising touch screen input (that’s for another blog post, though!). I got pretty excited when I started setting the icons for the game to be pictures of my girlfriend’s cat, but then I hit my first major snag: no sound support. I found a post on Stack Overflow where a Trigger.io developer suggested that sound support is on the roadmap, but low priority at the moment. I mentioned this on Twitter and Amir from Trigger.io got in touch with me directly and made some good suggestions and I eventually got sound working – albeit as a workaround using the video tag, and it has some lag on the sound. The support I received was excellent, which gives me a great deal of confidence in TriggerCorp.

The lack of sound support means this tool isn’t ideal for games development at the time of writing. This is a shame as for very simple games, just adding sound would make this a good platform for hobbyists like myself who don’t want to spend hundreds of hours building games in Java.

Soft Paws

Kitty enjoying Soft Paws

For a game, a super slick and polished app, or something really specific, you may prefer to build natively rather than use a tool like this. Overall, though, this seems to be a great product for rapid cross-platform development, particularly when paired with something like jQuery mobile. It is highly useful for prototyping and mockups to mobile to get a better experience than just a web browser and to provide offline support. Products like Trigger.io have significantly lowered the barrier of entry to mobile device development; I can see many smaller companies being able to get much better quality apps, much cheaper, because of this tool. Being able to cross-compile to multiple devices from a single source file is potentially incredibly useful, although inevitably there will be edge cases. I’d strongly recommend having a look and seeing if it works for you, and if you’ve already experimented with it, let us know what you think using the comment box below.

Want to see more?

The source code for my Soft Paws toy project is on my github.

https://trigger.io/ is the website for Trigger.io.

At Box UK we have a strong team of bespoke software consultants with more than two decades of bespoke software development experience. If you’re interested in finding out more about how we can help you, contact us on +44 (0)20 7439 1900 or email info@boxuk.com.