gavd.co.uk

Frail and faltering follower of Jesus

JavaScript/web gubbins – what I did on my holidays

By Gavin Davies

Bower, Cordova, Grunt, Zombie…

I just took a week off from ye olde daye jobbe and most delightful it was too! Lots of jamming with musicians, meeting lovely and fascinating people, fun nights out, saw the Partridge film, reading books, clearing my life laundry backlog, all capped off with a scenic 50 mile bike ride from Brecon to Cardiff in glorious weather – really couldn’t ask for more from a week off!

I also did a lot of tech stuff. I tried out a lot of new-to-me tools! Here are my thoughts:

Bower

Bower, from Twitter, is a dependency manager for the web – like Composer for PHP or Bundler for Ruby. More or less.

I switched a personal project to use Bower rather than Github submodules. There is a full post about this coming up on the Box UK blog, but this week I really it to my own projects and it worked pretty well. I’d definitely recommend this (or ANYTHING!) over Github submodules.

Cordova 3.0

Cordova underlies PhoneGap and is the FOSS distribution thereof – it’s a way to make apps for Android, iOs, Windows Phone, Blackberry etc from a single HTML5/JS/CSS codebase. You can dip into the underlying Java if you want as well. It’s part of the hybrid app scene.

Cordova’s had a big old update to 3.0 and it’s… promising. It seems to be lighter and leaner and more modular, but unfortunately I didn’t have much joy getting it running properly on Ubuntu. I mean, I could run the sample project and all, and the new scaffolding stuff is really helpful to hit the ground running, but the plugin installation wasn’t really happening for me. I’ll return to it at a later date but I got a bit fed up after half an hour or so.

Intel App Framework (with MVC)

Intel App Framework (dead link removed), formerly known as JQMobi, is a nice little jQuery-compatible(ish) library that works well on mobile/hybrid apps. It’s lighter than jQuery Mobile. The MVC component (dead link removed) is independent but plays nice with the main framework.

I’ve long been a user of jqMobi, and apparently it got bought out by Intel, which is great as development will continue. I like the fact that it’s light and I’ve even contributed back a couple of little fixettes myself. The new version is much improved, and the ‘droid Holo theme does look a bit like native ‘droid (although, like any hybrid, it’s never QUITE as slick!). I had a few minor teething troubles but they turned out to be bugs in my code that I’d, umm, hacked around before! Personal projects, eh? What you gonna do? 😉

Grunt

Easiest way to describe Grunt is “kinda like Ant for JavaScript”. I guess that’s a leaky metaphor but it does for me!

So, umm, the app framework exposed some problems with my JavaScript quality – problems I was only too aware of! You see, for personal projects, I’d hand-hacked a lot of Bash/Zsh scripts to do my dirty work. Nowt wrong with that. It is, however, nicer to use a recognised solution so you can take advantage of the cleverness of other clever sausages. Grunt was good for me as I could switch from my hand hacked linting scripts to use something a bit more together, man. IT IS GOOD I LIKE IT.

Next job – find something to test my app!

Yikes…

ZombieJS

ZombieJS is kind of a test runner and browser simulator, all in one

I tried to test my app using ZombieJS. I got the home screen sorta up but couldn’t really figure out how to “push the buttons” in any meaningful way – the app is single page and things get hidden or shown based on what’s going on (all handled by the Intel App Framework, which I’m now realised is a much more unwieldy term than jqMobi!). I think perhaps with more time with it I’d get better results but I got a little frustrated.

PhantomJS

PhantomJS PhantomJS is a headless WebKit – a browser with no screen, basically

I really like PhantomJS. It’s siiiiick! 😉 It’s really quite easy to script. It didn’t play well with my app – but I’m not sure where that’s coming from, I got similar problems in Firefox and ended up hacking around the framework to work for me on the desktop, which isn’t really its use case. I still need to tinker with this some more.

Foundation

Foundation is another Bootstrap kinda thing for getting a web user interface up and running quick smart

Foundation is GREAT! It’s like Bootstrap, but a bit lighter and has a nice, clean interface. Looked fine for me on the platforms I had to hand (‘Droid 4.3 on a Nexus 4 and Nexus 7, and also Chrome and Firefox on Ubuntu). Would I use it over Bootstrap? Ehh, there’s really not that much to choose for someone like me; they’re both flipping great!

Book – Functional Javascript

Functional JavaScript by Michael Fogus is the best book I’ve read on JS since Crockford’s classic “JavaScript: the Good Parts“. Really very fascinating indeed. I’ll probably write more about this at some point but suffice to say it’s a fascinating insight into using JS in a functional manner, using Underscore.js and raw JS. Now I know the purists will probably jump up and down saying JS isn’t a pure functional language but whatever. Our job isn’t to be “pure” but to write software that works and is efficient and costs as little as possible and the functional paradigm has much to teach. GET THIS BOOK!

Other

I also tinkered with qunit and jasmine – not sure which JS test tool to pick. I might need something more at an integration level like Selenium, but most of my experiences with that have been flaky.