The modern web is tearing down the borders of the browser window and allows us to create so much more than just another website.
This talk is a whirlwind tour of how 3D and virtual reality can be woven into entirely new applications that the web hasn’t seen yet. On top of interactive 3D web applications with WebGL we’ll go through the history of 3D on the web.
In addition we’ll see how we can unlock the powers of the GPU thanks to GLSL.
We will then explore the amazing superpowers that Virtual Reality is currently bringing to the web and teleport us to places we can’t go.
This is going to be accompanied with live coding 3D demos and weave them together with other web technologies such as WebRTC and Web Audio and lots of show cases and demos to give you inspiration on what to build with your freshly-learned tricks and know-how.
Promises are now a part of the ECMAScript standard, and shipped in all major browsers.
At the first glance Promises may seem trivial: replacing a regular callback with a .then(callback). However, the ability to represent asynchronous execution as an object enables and simplifies many kinds of useful programming patterns.
With Promises you can easily control concurrency for parallel and serial execution, implement robust asynchronous caching, and have an alternative way of handling events.
At Financial Times’ we’ve upgraded our web app from a jungle of callbacks to Promises, and found that asynchronous code became simpler, more reliable and faster thanks to improved parallelization.
In this talk I’ll describe what we’ve learned: the common, most useful patterns—and gotchas!—that have emerged. You’ll learn not just the Promises API, but the bigger picture: how to use Promises to neatly solve problems like caches protected against the “thundering herd” problem, a ‘load’ event that cannot be missed, and how to integrate with Promise-based code to ensure all errors are handled properly.
Ever since we moved away from using tables for layout, we’ve been hacking around floats and positioning to achieve layout on the web. These methods are flawed and complex, making simple things hard to achieve. Flexbox and CSS Grid Layout give us layout mechanisms signed for the sort of things we build on the web. In this talk I’ll take a look at both, showing the problems they each solve and how they work together to create a new paradigm for layout on the web.
Web-based WYSIWYG editors are notorious for spitting out a distasteful HTML soup. In this talk I’ll show how I implemented an editor that, instead of trying to filter and clean this soup, takes control away from the browser’s contentEditable implementation, and reinterpret user actions as operations on its own semantic document model.
A talk about Angular of past and present—how to speed up your applications through key performance aspects, best practices, and why you should be doing it.
It’s impossible to write software that doesn’t break. The more complex software gets, the bigger this problem.
This talk isn’t about what tools to use to test your code. Instead we’ll be focusing on the concepts of unit testing and how testing will make you a better developer in general.
Animation is a powerful way to convey meaning and guide tasks both for interfaces and presenting data. Conveniently, our old friend CSS has seriously stepped up its animation game! In this session, Val will cover key animation principles and how to pull them off with CSS. Val will show you the highlights of animating with CSS and combining CSS and SVGs. Plus, which web animation options work best for common interaction and tasks.
Workshop day 1
I feel I’ve written `X.prototype.y = function…` about a thousand times more than I’d like. Now that ECMAScript 6 (or ECMAScript 2015) is fully specified, and mature compilers make it possible to run it in yesterday’s browsers, I’ve made the jump. This workshop will show you how to set up your build process to conveniently work with ES6 and modules, even for browser code, and will run through a long list of ways in which ES6 improves the ergonomics of the language.
No special requirements.
This workshop will cover the new CSS modules that have been developed for CSS Layout. This is a forward-thinking workshop, geared to ensuring that your CSS skills are right up to date with emerging technology. However there will be plenty of things you can use right now with a progressively enhanced approach. Using practical examples and code to demonstrate all of these modules, and you’ll be able to take away those examples to use as starting points and reminders after the workshop.
This is not an introduction to CSS so you should already understand HTML and CSS and existing layout methods (float, positioning).
Motion design is a necessary skill for anyone working on the web today. It’s time to embrace the power and benefits of web animation! Learn the motion design skills you need to design and build purposeful and sophisticated animation into your work. You’ll gain expert knowledge of the current web animation landscape and how animation fits into your design process.
A laptop with your favourite modern browser(s) and a free CodePen account is all you need.
Join Todd in this one day workshop, where he will teach you how to jump straight into building an application with Angular.js. Todd will run through core project setup and and demonstrate how to start integrating some of Angular’s most powerful features, from two-way data-binding and callback-less Model updates, through to dynamic routing. He will also look at the concept of the modern web, such as ShadowDOM/Web Components, single page applications and how these map to things such as Angular Directives and XHR/Ajax content. You’ll learn key skills and will explore new client-side capabilities (some inspired by the server) with features such as conditional DOM loading/unloading, expressions, templating and dynamic routes. Taking a holistic and high level view, this full day session will prime you on all the basics and how you can leverage the framework to rapidly develop new applications the modern way.