The JavaScript blog.


apps sponsored-content recruitment

Node Roundup: npm jQuery, io.js 1.3.0, proginoskes

Posted on .

npm and jQuery

It's finally happened: jQuery is recommending npm for distributing plugins. My preferred client-side workflow is npm and Browserify, but I know many readers use Bower. Hopefully this shift will encourage more people to use npm for client-side libraries.

Lin Clark mentioned this in this week's npm Weekly, and also that npm has hit 1,000,000,000 downloads in a single month. Very impressive!

io.js 1.3.0

io.js 1.3.0 is out. As usual the details are in the nicely marked up changelog, which now contains links to commits. That makes it easier to look up what the commits actually do, because the one line descriptions can't always communicate the subtleties of the pull requests. You'll probably think I'm being sarcastic, but I was happy to see these changes:

It's all about attention to detail! In general this release feels like it's focused on quality control -- there are lots of JavaScript code quality fixes and documentation tweaks.

The new changelog formatting also lets you easily see which commits come from Node:

I think it's @rvagg who writes this document, so thanks Rod for making it easier for us to see what's going on.


Jason Gerfen sent in proginoskes (GitHub: jas-/proginoskes, License: MIT, npm: proginoskes), a module for monitoring logs from multiple sources by using SSH as the transport. It gives you an object stream, so you can format the results however you want. You can also easily see each source, because the objects have a server property.

This will work really well if you're used to writing ~/.ssh/config with aliases for servers and keys. The configuration options for proginoskes allow you to define the port, username, private key, and log file location. You could easily pipe your server logs to multiple locations for archival purposes, stats, and error notifications.

This project is based on the ssh2 module which is actually an SSH client by Brian White that's written in JavaScript. The ssh2 module also exposes a stream-based API, but for the underlying SSH protocol.


apps sponsored-content recruitment

Find Your Next Developer with this JavaScript Online Test

Posted on .

Hiring programmers is hard work. Finding candidates takes time, and then figuring out if they've really got the right skills can be tricky as well. I've done technical tests as part of interviews before, and some have actually been enjoyable, but most have been quite poorly conducted. Tests for Geeks is a service that aims to improve the technical testing process, by providing high-quality tests with reports that are easier for recruiters to understand, and tests that programmers can undertake and attach to their CVs.

Tests are timed, and the default JavaScript test is designed to take 45 minutes. There are some rules: you can't press any keys or copy questions, and it tries to discourage candidates from circumventing these rules. If the candidate attempts to press any keys they'll see a prompt warning them -- then the test can be continued by pressing a button.

There's a JavaScript online test that includes questions that would be useful for testing client-side developers. Your HR manager or recruiter can easily create unique links to send to candidates. Because there are so many JavaScript tools and frameworks, you might find this test works well for judging a candidate's general JavaScript skills.

To actually test candidates, you'll need a paid plan. Plans start at $29.95 for three tests, but you can buy unlimited tests for a month for $99.95. If you were looking to hire someone quickly and had lots of applicants, then naturally the unlimited plan would make sense. Also, the paid plans support custom branding, so you can use your own domain name and logo. Tests for Geeks have many other programming tests and the last one which they launched was iOS and Objective-C test.

One thing I like about Tests for Geeks is the recruiters I've worked with before can easily understand the reports. The coding test reports explicitly show the strength in each area, so if they've got better knowledge of the DOM you should see that on the report with a higher ranking. This is what the report looks like:

Sample report

I've seen a few online test sites before, but this is the first one that I've used that is specifically designed for technical tests. If you haven't done a technical test before then you might like to try it out, or you could even create some new questions.

Many thanks to Tests for Geeks for sponsoring DailyJS!


ui templating apps angularjs

Fltspc, Mustache-Wax

Posted on .


Clint Heyer from the IT University of Copenhagen sent in Fltspc, which is a collaborative whiteboard. If you do group meetings where you want to work on snippets of text in a way that Google Docs doesn't quite cope with, then you might like to try this project out.

It can be extended with JavaScript and a REST API -- there's a GitHub repository with more information at ClintH/fltspc-client, and I also found an Android example.

Clint also shared a project they use to get students started with modern JavaScript development. It's called Kattegat, and it uses Yeoman and Express to get a server running with fun things like Socket.IO and Tessel.

If you're interested in Clint's Android work, then also take a look at Anders Bech Mellson's Kiosker project. This is a generator for Android kiosk applications that displays a single web page, and it's configurable through JSON. It sounds like this is what the students have been using to demo their interactive experiments on tablets.



Mustache-Wax (GitHub: jvitela/mustache-wax, License: MIT) by Jonathan Vitela is an extension for Mustache.js which allows you to use formatters inside expressions, in a style inspired by AngularJS. By defining a list of methods on Mustache.Formatters, you'll be able to pass values through the filters.

The expressions use pipes, and you can chain them like this: ten | add : 3.14159 | add : twenty | add:-3. The expression syntax supports arguments, which are denoted with :.

The documentation is nicely presented, and the project is well-tested.


apps tablets festive

Holiday Hacking: Apps

Posted on .

What do you do when you leave your computer/laptop at home while you visit family for the holidays? I always do this, thinking that it'll be better to spend some quality time with the family, but there are moments where people are doing their own thing and I wish I had a laptop to play with some code.

These days of course many of us tote around tablets or large phones, so there is some potential for hacking or at least learning about new programming techniques. One of my favourite apps is actually Vim, which you can get for iOS and Android:

To the uninitiated, Vim for a touchscreen sounds horrible, but it's actually pretty good -- because it's modal you can enter Command-line mode with : and leave with the escape key easily enough. If you're an experienced Vim user then it can be revealing to think about the mnemonics for commands rather than relying on muscle memory.

I also found that the big programming video services have iOS and Android apps, so you can study a new programming language, framework, or library:

I've actually used the Pluralsight app on Android during my commute to help me learn enough C# to implement the Windows portion of a Node/Windows/iOS/Mac application I work on professionally.

Because tablet operating systems support browsers, then there are a lot of apps that wrap the built-in JavaScript interpreter to allow you to practice writing JavaScript. For example:

And you can even write Node on iOS with Node - JavaScript Interpreter. There are manuals for Node on the Play Store as well. Or you can get a more broad manual management app like Dash. I found Dash useful for looking up Mozilla's JavaScript documentation, and Node's, when I was working offline on my Node book.

Apple and Google's book stores also sell many technical books from the popular computer science book publishers, so you should be able to find something to do while your parents argue and your partner is walking the dog, wrangling toddlers, or snoozing after too much turkey.


graphics apps graphs reactjs

Omniscient.js, Paths.js Update, React Example Shopping Cart

Posted on .


Omniscient.js (GitHub: omniscientjs / omniscient, License: MIT, npm: omniscient) by Mikael Brevik and Torgeir is a React library for rendering components using immutable data. This is ideal for use with Immutable.js, but other libraries could be used as well.

It uses cursors, so the outer immutable structure swapped when a component's data is changed. This might sound like it would perform badly, but it only re-renders component trees that reference changed data.

The module is used by wrapping components with the omniscient function. The author's examples call this "component". These components only deal with their own piece of data, so they're nicely encapsulated and potentially easier to reuse.

The project has lots of examples and documentation, so it's worth reading through the readme first to get a feel for it.

Path.js Update


Andrea Ferretti wrote in to say Paths.js has been updated to include tree charts, waterfall diagrams, Sankey diagrams and a preliminary version of force-directed graphs.

This is what the tree chart looks like:

tree = new Ractive  
  el: '#tree'
  template: template
    Tree: Tree
    data: ducks
    children: children
    width: 350
    height: 300
    leaf: (point) ->
      not (children(point)?.length)

tree.on 'toggle', (event) ->  
  node = event.context.item
  node.collapsed = not node.collapsed

The author is also working on performance improvements and lots of other cool stuff, so it's worth keeping an eye on this library.

Coinbolt Cat Shop

JP Richardson sent in Coinbolt Cat Shop (GitHub: coinbolt / catshop, License: MIT). This is an example of a React.js shopping cart, intended to be used with Bitcoins.

The author points out that you can actually use it with fake Bitcoins for testing purposes.