SydJS - January 2014

BeAs3YACYAA4o6B.jpg

On Wednesday, I travelled to Sydney to speak at the January meeting for SydJS, Sydney's super-awesome group for JavaScript developers. SydJS is organised by some really great folks and it was quite humbling to be amongst the other speakers scheduled for the night.

First up was Hourann Bosci who spoke about a number of mapping solutions for developers. These ranged from Google Maps to Bing Maps and others. His personal preference was to leverage Leaflet, which is "a modern open-source JavaScript library for mobile-friendly interactive maps."

logo.png

From the Leaflet website:

Leaflet is designed with simplicity, performance and usability in mind. It works efficiently across all major desktop and mobile platforms out of the box, taking advantage of HTML5 and CSS3 on modern browsers while still being accessible on older ones. It can be extended with a huge amount of plugins, has a beautiful, easy to use and well-documented API and a simple, readable source code that is a joy to contribute to.

Hourann demonstrated how to integrate data into Leaflet through the use of layers that leverage D3.js for SVG. He did this by superimposing word clouds with data from the SydJS website on to a map of the Sydney CBD.

Next up was Tom Walker who blew up my brain with his project, Cognizance, which is currently unavailable but it slated to be released very soon. It's a combination of an event-driven backend that powers a sexy dashboard front-end that has a number of widgets from a variety of data sources including Trello, GitHub, and others. The UX is really nice; it's motivated by split-flap displays you see at airport terminals or railway stations.

Much like the matrix, you cannot be told what Cognizance is... you have to see it for yourself. Let me put it this way: this was my reaction:

mind-blown.gif

Dashboards can be wonderful at conveying information quickly. And while many of the solutions I've built or seen often suck in the UI/UX department, Cognizance certainly does not.

I found the backend architecture and eventing strategy that underpinned Cognizance quite interesting. Due to time constraints, Tom wasn't able to go into great detail about it. From what I gathered, Tom has devoted a considerable amount of thinking into the performance and scalability of his solution - particularly for mobile.

I am eager to learn more. That's for sure.

Photo credit: https://twitter.com/nolim1t/status/423382160439926784

Photo credit: https://twitter.com/nolim1t/status/423382160439926784

The weirdest point of the night came about when Joseph Gentle did a lightning talk on a project they've been hacking on that provides the ability to create virtual circuits. It's called boilerplate and is described as "a multiplayer steam-based CPU simulator". While the idea of a CPU simulator isn't particular out of the ordinary, the use of steam power to simulator one certainly is.

boilerplate is difficult to describe. Essentially, they use a 2D canvas to position elements that exhibit fluid mechanical properties. (I know, I know. Bare with me.) By placing these elements on the canvas, they are able to construct primatives such as OR and AND operation gates. Composing these primatives together, they were able to build some rudimentary circuits.

If anything, the presentation provided some comic relief. A few jokes were thrown out by the audience. Being no stranger to making a jackass of myself, I shouted out that they were missing a turbo button.

Screen Shot 2014-01-16 at 2.38.21 pm.png

My presentation covered Polymer, a framework for building Web Components through a set of polyfills for specifications like Shadow DOM, HTML Imports, HTML Templates, and Custom Elements. I felt like I did a reasonable job covering the motivations behind Web Components and how Polymer is striving to bring them to evergreen browsers today.

For my demo, I decided to get away from the high-level messaging of Polymer and to work simply within the confines of JSBin. I demonstrated how to create a custom element from scratch. From there, I showed how features like data-binding and events operate in Polymer.

Eric Bidelman is a Developer Advocate for Google who's been championing the project for a while now and he's posted a number of excellent presentations to YouTube. He's also posted a number of great presentations to html5-demos.appspot.com. They are well worth your time to check them out if you're wanting to hear more about the future of front-end web development through Web Components (and Polymer).

To me, Web Components (and Polymer) are great steps towards getting some control over our front-end development because - let's face it - it's a bit of a mess at the moment. That stated, I did openly share some questions I have considering things like the metadata story, the security model, the overall performance, etc. Nevertheless, it is exciting to see where all of this stuff is going.

Another month, another great meeting of SydJS. If you find yourself in Sydney and you're looking for something to do on a Wednesday night, why not make the effort to hang out with some of your fellow JavaScript developers? They're a friendly bunch of folks. If anything, the free beer and pizza are reason enough to go!