This article contains 22 images. You will find them at the very end of the article.

This article contains 3943 words.

Web Directions Code 2013

The conference runs from 9am to 5pm on May 2nd and 3rd, with parties after the show on both nights.

 Thursday May 2 9.00am The politics of JavaScriptAngus Croll 10.05am Morning tea 10.35am Taking JavaScript seriouslyJeremy Ashkenas 11.30am Create impact with CSS filtersAlex Danilo 11.50am What's ECMAScript 6 good for?Julio Cesar Ody 12.10pm JavaScript's Slightly Stricter ModeGlen Maddern 12.25pm Lunch 1.25pm CSS preprocessor performanceNicole Sullivan 2.20pm Making and keeping promises in JavaScriptTony Milne 2.40pm An introduction to the File APICameron McCormack 2.55pm Afternoon tea 3.25pm HTML5 Multi-party video conferencingSilvia Pfeiffer 3.45pm Source Maps for debuggingElle Meredith 4.05pm See the tries for the treesJared Wyles 5.45pm Opening night partyThe Long Room (162–168 Collins St) Friday May 3 HTML, CSS and the client-side appGarann Means Morning tea What everyone should know about RESTMichael Mahemoff HTTP/2.0: WTF?Mark Nottingham Ghost in the Shadow DOMRyan Seddon Essential security practices Troy Hunt Lunch Put on your asynchronous hat and NodeMarc Fasel TypeScript and TerminatorsAlex Mackey IndexedDB, a database in your browserAaron Powell Afternoon tea Orientation-motion-sensormatic machineAndrew Fisher Test, tweak and debug your mobile web appsChris Ward Making things with mathsSteven Wittens Closing night partyBaroq House (9–13 Drewery Lane)

Day One–Thursday, May 2nd

Angus Croll The politics of JavaScript

British philosopher John Locke cautioned that all knowledge is limited by experience. We can only wonder what he would have made of the JavaScript community, where understanding of, or familiarity with, the problem space are of little concern when there's a good bandwagon ready to be jumped on.

I'll ponder the emergence of moralizing and faith-based JavaScript and discuss how an alternative approach grounded in knowledge, experience and understanding can not only make us better developers but also, by freeing us from FUD induced constraints, encourage creativity and innovation.

Angus is a displaced Brit who now works for Twitter’s web core team in San Francisco, and is one of the principal authors and maintainers of Twitter's Flight web framework. He's obsessed with JavaScript and literature in equal measure, and is a passionate advocate for the greater involvement of artists and creative thinkers in software

Morning tea: parlez–vous Francais?

Mini eclairs with coffee cream and mocha icing, plus mini feta and spinach quiches. Bon appetit! Oh, and the food may be French but the coffee is not: courtesy of Mozilla we will have two carts serving the finest barista coffee.

Jeremy Ashkenas Taking JavaScript seriously with Backbone.js

More and more folks are bringing ever larger pieces of their web applications to the client side. You might begin to do it for raw speed, for a particular visualization, or for an "application-like" experience, but regardless of why you do it -- you're going to have to start taking your JavaScript seriously.

We'll discuss how Backbone.js is aimed at the common patterns that JavaScript-heavy web applications rely on, how the pieces work together, and some of the design decisions that give Backbone its flavour.

Jeremy Ashkenas is a programmer-at-large. When not being itinerant, he works on the Interactive News team at the New York Times, and on DocumentCloud.org. He created the CoffeeScript programming language, Backbone.js and Underscore.js, among other open-source projects.

Alex Danilo Create impact with CSS Filters

CSS Filters are a powerful tool available in all modern browsers to bring amazing photographic effects to web content. They can transform and manipulate the visual output in all sorts of amazing ways. From simple colour manipulation, blurring, etc all the way to complex combined effects, the creative possibilities are almost endless.

Understanding how to use CSS filters, what they do as well as how to combine multiple filters for advanced effects will all be explained. Performance impact from use of filters is an important consideration as well and will be demonstrated. Current browsers are enabling these effects with H/W acceleration even on mobile devices, and we‘ll cover what they do, how to use them, best practices and more. Next generation browsers coming really soon will be building on enhanced custom filters. Custom filters are cutting edge but build on top of the filter model. We‘ll explain what a custom filter is, what it does and taste some of the possibilities for future creative content.

Alex has spent over a decade on various W3C working groups developing the standards we all know and love, all while running a couple of start ups doing web engines for mobile and embedded markets. He now works at Google, spreading the good word about HTML5 and Chrome.

Julio Cesar Ody What’s ECMAScript 6 good for?

An introduction to ES6 with emphasis on its practical aspects. See what it can do for you today, and learn how you'll be able to better structure client–side programs with this next step in the evolution of JavaScript.

Julio is an independent back/front-end developer and designer who loves doing some writing on the side. He has worked with a range of tech, from network security to VoIP and then web stuff. He’s currently busy with a bunch of open source projects and focusing on design as hard as he can.

Glen Maddern Javascript's Slightly Stricter Mode

"use strict";

You might have seen someone else type in this magical incantation at the top of a file. Maybe you’ve seen it in an open-source library. Maybe you first used it when Yeoman generated it for you (hint: I did). In this short, sharp session, we’ll cover what Strict Mode really is, when to use it, why you probably want to, and how to do so safely.

Glen Maddern is a reformed backend developer, coming around once he realised that the internet was a Cool Place™ where people do Interesting Things™. So he helped start the super awesome movie review site Goodfilms. Now he works on making it the coolest, most interesting and most internet-famous movie site of all.

Lunch

Head to the buffet for classic limestone coast beef goulash with caraway kipfler potatoes and sour cream; confit Tasmanian salmon salad with organic soba noodles and a fragrant herbs and palm sugar dressing; and shiitake, enoki and swiss brown risotto with crème fraiche and shaved Milawa tomme.

Nicole Sullivan The top 5 performance shenanigans of CSS preprocessors

CSS is a simple declarative language. Preprocessors were introduced to overcome it’s many limitations. Developers have long awaited this functionality, and the use of CSS preprocessors like SASS, Less, and Stylus has become ubiquitous on big websites. Yet CSS preprocessors often output some downright ugly code. During this talk, you will learn about preprocessor performance best practices.

Nicole is a UI performance nerd living and working in San Francisco. She helps companies make their CSS smaller and their UI more manageable. She is also an author, most recently contributing to the Web Performance Daybook Volume 2. Photo taken by John Morrison.

Tony Milne Making and keeping promises in JavaScript

An overview of using promises in JavaScript to clean up the async callback pyramid developers often face when building more advanced functionality in the browser or using node.js, this session will cover the theory of when and how and then provide concrete examples using the “q” promise library.

Tony is a co-founder of Inlight Media, a leading Melbourne web and mobile development company who specialise in Node.js backed iOS/web projects. He helps organise and regularly attends MelbJS (a Melbourne JavaScript group) and the Melbourne Node.js meet-up.

Cameron McCormack File > Open: An introduction to the File API

HTML has long had the ability to upload files to a server, at least since as far back as HTML 3.0 published in 1995, but it is only relatively recently that web pages have been given the ability to read files selected by the user directly in the page, without having to send them to the server first. The availability of the File API across the major browsers is steadily increasing, with Internet Explorer 10 implementing the API most recently.

In this session, Cameron will introduce the File API and demonstrate how it can be used in conjunction with HTML 5 <input> elements to create a client-side Web application that can access a user’s local files.

Cameron is a Software Engineer at Mozilla, where he works mostly on the SVG and CSS support in Gecko, the Web rendering engine behind Firefox. Based in Melbourne, he is also heavily involved in Web standards activities at the W3C, where he is the editor of the Web IDL specification and co-chair of the SVG Working Group.

Afternoon tea: it’s time for a cuppa!

Warm fruit and plain lemonade scones with Yarra Valley preserve and vanilla cream, plus grab yourself another shot of barista coffee courtesy of Mozilla!

Silvia Pfeiffer HTML5 multi-party video conferencing

Last year at Web Directions Code we saw Silvia hack up the JavaScript and HTML code for a video connection in the browser without using plugins. This year she takes this to the next level to explain how you can do multi-party video conferencing in the browser using WebRTC. We expect that we’ll be able to do this across Chrome and Firefox this year some time!

Silvia is an open video technology enthusiast with a long background in open source software, media technology R&D, and in open standards. She worked as a Google contractor on video accessibility for the Web and became the editor of the WebVTT specification and co-editor of the HTML5 specification at the W3C. She is the author of “The Definitive Guide to HTML5 Video”. Silvia is now working for NICTA on new applications using WebRTC.

Elle Meredith Source Maps for debugging

Debugging JavaScript on the client side is easier with the built-in developer tools in Chrome and similar browsers. But how would you use a debugger on a CoffeeScript program? Or in a second scenario, what if your JavaScript source files get combined, minified and optimised for production. Wouldn“t it be nice for the code to still be readable and debuggable on the client side? Enter Source Maps. In this talk, we will learn how to get started debugging CoffeeScript applications using Source Maps.

Elle is a web designer and developer with a passion for web standards and a unique background that bridges the gap between the front– and back–end. She employs best–practice techniques to deliver clean, functional and user–friendly websites. In 2007, she discovered Ruby and has since been building web applications with Ruby, Rails, Haml, Sass, Coffeescript and other such awesome technologies.

Jared Wyles See the tries for the trees

Stop. Put down the keyboard. Have you thought about your data structures Why is that an array? Have you thought about your algorithms? Why are you iterating over every element? Through this talk we will look at the history of algorithms and data structures and how we can evaluate their strengths and weaknesses before we write a single line of code. We shall look at some different programming languages and see how concepts from academic languages have driven some of todays largest scaling websites.

As a senior computer scientist at Adobe, Jared is putting his money where his mouth is in order to improve the web. Previously, he’s worked with Atlassian, Bigcommerce, and the usual digital agencies.

Opening night party

After we wrap up on Thursday afternoon, pop round the corner to The Long Room (162–168 Collins St) for a couple of drinks and a bite to eat and a chance to share some of your thoughts on what you’ve seen today with other conference attendees, courtesy of 99designs. Make some friends and head out to some of the restaurants and bars on the Web Directions Code map. Take it easy though: see below for the 9am start tomorrow morning!

Day Two–Friday, May 3rd

Garann Means HTML, CSS and the client-side app

Everyone knows client-side applications are built with JavaScript. Right? JavaScript ties the application together, but a considerable amount of most applications deals with markup and presentation. As much as they affect JavaScript, state, event handling, and default browser behaviour also impact HTML and CSS in the choices we make, optimizations we can take advantage of, and the architecture of our applications as a whole. And the HTML and CSS that make up the structure of our applications need to be managed just as much as our JavaScript does. We’ll talk about how HTML and CSS fit into the the big picture and how to take greater advantage of them in a context where we frequently consider them last.

Garann is a JavaScript developer from Austin, Texas, USA. She’s the author of Node for Front-End Developers and the organizer of Austin All–Girl Hack Night and Girl Develop It Austin. Garann is also one of the hosts of the Frip Frap web development podcast.

Morning tea: coffee me!

Freshly baked assorted mini danishes plus Mozilla barista coffee.

Michael Mahemoff What every web developer should know about REST

As web developers, our work builds on the the conventions of REST, whether we know it or not. By getting to know these conventions, we can design websites and web APIs that are faster and easier for other developers to learn and navigate. Using real-world examples, this talk will introduce REST from a front-end developer’s perspective, explain how to handle the typical problems that arise, and point to current trends and limitations of the protocol.

Michael Mahemoff is a full-stack web developer, always looking at ways to make the web a more habitable place for users and developers alike. He is currently putting podcasts in the cloud at Player FM, using a mix of Rails and HTML5, and previously worked at Google as a Chrome Developer Advocate. He first programmed for the web in the mid-90s and wrote O'Reilly's Ajax Design Patterns in 2006. Michael obtained a PhD from the University of Melbourne on design patterns for user experience in 2001.

Mark Nottingham HTTP/2.0: WTF?

After 15+ years of the same protocol, we’re now talking trying to upgrade the underpinnings of the Web. Find out who’s behind it, what they’re doing, and how it might affect you.

Mark Nottingham has helped develop Web technologies like Atom and HTTP for more than ten years. He is Chair of the IETF HTTPbis Working Group, an effort to first clean up HTTP/1.1 and then develop HTTP/2.0 and currently works for Akamai, the world’s first, largest and best public Content Delivery Network.

Ryan Seddon Ghost in the Shadow DOM

The DOM will finally have real encapsulation with the introduction of the Shadow DOM, a subset of the Web Components spec that will revolutionise web development as we know it. In this session we’ll take a short, sharp tour on the how and why of what the Shadow DOM has to offer.

Ryan Seddon is a Senior Front-end Developer from Melbourne Australia who has an unnatural obsession with JavaScript and the many places it runs. In his spare time he’s either playing basketball, writing for his blog thecssninja.com or committing code to github.

Troy Hunt Essential security practices for protecting your modern web services

These days, modern web design offers some fantastic new ways of building highly responsive apps using asynchronous services called directly from the browser. We now regularly create and consume services which we never directly see in the address bar, rather they're consumed in the background by the likes of JavaScript and rich client mobile apps. But are you properly securing all those fancy new asynchronous requests? Just because they're not as visible as traditional webpages doesn't mean they're any less vulnerable to attackers.

In fact it's often the opposite; web service security is frequently neglected as the service is "out of sight, out of mind" and we're increasingly seeing these exploited by attackers as their popularity increases. Let's take a look at what it takes to build secure services, how to easily find the ones that aren't and then what an attacker might do to exploit those that remain vulnerable.

Troy Hunt is a Software Architect and Microsoft MVP for Developer Security. Troy has spent the last 17 years building web applications and now specialises in software architecture and security. He blogs regularly about security principles in software development at troyhunt.com, is the author of the OWASP Top 10 for .NET developers series and recently the free eBook of the same name.

Lunch

Sample some massaman lamb and potato curry with steamed jasmine rice, coriander and roasted peanuts; salt and pepper crumbed lake entrance flathead with shoestring fries and sweet chilli aioli; or handmade ricotta gnocchi with fresh tomato, crushed peas, pine nuts, spring herbs and shaved Shaw River Annie Baxter cheese.

Marc Fasel Put on your asynchronous hat and Node

Node.js takes the asynchronous nature of browser-side JavaScript and extends it to the server. While a little bit of asynchronous in the browser never hurt anybody, going head-on with asynchronous programming on the server may put you in a whole lot of pain. At its best, server-side asynchronous programming has a significant pay-off: a blazing fast and highly scalable back-end. However, it's not for the faint-hearted, for if you're not careful you can end up with your head spinning in a bowl of spaghetti code. This presentation will explore the asynchronous workings of Node.js, describe asynchronous application code patterns, and show how to leverage asynchronous libraries to build scalable and maintainable Node.js applications.

Marc Fasel has been building high-performance scalable applications since before you were born, and still has a passion for writing fast and excellent software. He is a senior consultant, architect, and thought leader at Shine Technologies, a boutique software development and consulting company from beautiful Melbourne.

Alex Mackey TypeScript and Terminators

TypeScript is a new language from Microsoft that is a superset of JavaScript and provides some awesome functionality such as static typing, better IDE support, and an easy to use way to develop classes & interfaces. This session will use the underused medium of Schwarzenegger films to explain just what Type Script is, why you might want to use it & when you should avoid it (like that terrible movie where Arnie got pregnant).

Alex is an experienced consultant with over 11 years’ experience in .NET technologies who works for Kiandra IT. He wrote the books Introducing .NET 4.0 & Introducing .NET 4.5 for Apress.

Aaron Powell IndexedDB, a database in your browser

So you’ve got an idea for a great offline application but there’s one hurdle, data. Without the ability to create, edit and persist data you’re running up against a wall. IndexedDB offers to solve these problems for you but just how do you get started? In the world of bleeding–edge browsers how would you approach this in a cross-platform solution? And with an API that looks right at home on a server how do we deal with transactions, keys, indexed and cursors?

Aaron Powell is a Senior Developer and Web Technical Specialist with Readify in Sydney and IE UserAgent. While .NET might be his home his passion lies in the land of JavaScript. He believes that one day the machines will take over and be programmed in JavaScript so it’s time to learn it.

Afternoon tea: bacon or brioche?

One final treat: will you choose mini-BLTs or warm brioche doughnuts? Too hard? You can probably sneak one of both!

Andrew Fisher The wonderful-amazing-orientation-motion-sensormatic machine

Mobile devices are amazing things. Not only can you use them to make phone calls, but they are jammed full of interesting sensors such as accelerometers, gyroscopes and GPS chips. These amazing components not only tell you where you are on the planet but also the direction you're facing and how many G’s you happen to be pulling as you ride the tram on the way to work.

And all of this is now available in the web browser through the Device API. In this short session we’ll look at how to get access to the orientation and motion data available to the mobile browser. Rather than just using it to turn your page the right way up no matter which way you’re holding the device, we’ll look at how to use these APIs to create applications with new input methods based on sensor data as well as user interaction.

Andrew Fisher plays at the intersection of the web, mobile tech, ubicomp and data.He does some real work too and has been involved with organisations globally since the dawn of the web creating digital solutions for brands including Nintendo, peoplesound, Sony, Cotton On, the Melbourne Cup and Optus. Andrew is the CTO for JBA, a data agency in Melbourne, Australia.

Chris Ward Test, tweak and debug your mobile web apps with ease

When building a website aimed at desktop users you have a myriad of methods for testing, trialing and debugging problems as well as tweaking them in real time to instantly see the affects of your changes. Whilst mobile web apps can be a fantastic time saver, trying to quickly view the changes you're making can be something of a long winded stab in the dark, especially if you decide to utilise a platform such as PhoneGap… Or is it? let's shine a light on some tools and tricks.

Chris Ward has a plethora of experiences under his belt that hopefully contribute towards a desire to work with projects and technologies that make sense and people's lives easier. These days a project manager, he has specialities in CMS, CRM and mobile.

Steven Wittens Making things with maths

The browser used to be a meek sandbox, shut off from all the things that native apps could do. But now we’ve grown up, and with WebGL, Canvas, Web Audio, Device Access and more, we have a lot of power at our fingertips. To really unlock this potential and make all this data dance, we need maths.

Steven Wittens is a long time web developer, recreational mathematician and graphics enthusiast who left his native Belgium years ago in search of adventure and better internet. Ever fond of playing with the cutting edge toys, he maintains the tech blog Acko.net, a living demo of JavaScript, CSS 3D, WebGL and whatever else he can manage to get working.

Closing night party

Time to let your hair down after an intense couple of days at our legendary closing night party. This year we’ll be just up the street at Baroq House (9–13 Drewery Lane).