Angular - All Talks from AngularConnect Over the Years (2015-2018)

November 16, 2018 58 min read Angular

A collection of all lectures that were ever presented during the Europe's largest Angular conference in 2015, 2016, 2017 and 2018 - within one page. Each session includes a concise description and relevant slides.
Contents

Day One (2018)

Keynote

Presented by Igor Minar

Slides

VS Code Can Do That

Presented by John Papa

How do you debug so easily in VS Code? How can I debug remotely in the cloud or locally in a docker container? What are those key combinations to edit code so quickly? What extensions are the ones I shouldn’t code without? Get ready to hit the ground running in this fast-paced, demo-heavy talk that takes you through some of the best and most effective tips and tricks in VS Code. Learn how to setup your environment and customize it the way you like it. We’ll also learn how to use Live Share so we can pair program on the same app! You’ll walk out with several tips on how to be more efficient with one of the hottest tools on the Web today!

Automating UI development

Presented by Stefan Baumgartner and Katrin Freihofner

Design systems and pattern libraries help designers and developers to get a common understanding of user interfaces. But even with such tools in place, there’s a ton of processes and handovers involved. Each one causing possible friction and information loss. Especially over time. This might lead to new features feeling outdated on release, and screens and mock-ups getting too old too fast.

With our recent move to Angular and Sketch, we were able to automate 70% of our UI development. Helping our developers to focus on the real problems, and reducing the UI review efforts tremendously. Join us and see how we produce a single source of truth for developers and designers, and how we are able to consume this source in our tool of choice.

Slides

How to save time & money by planning your ngUpgrade

Presented by Sam Julien

There are tons of resources out there on how to upgrade from AngularJS to Angular, but no one ever talks about how to approach such a monumental task - and if you even should. How do you figure out where to start, which path to take, and whether it’s even worth it for you or your company to spend the time and money? Should you do a top-down, bottom-up, upgrade shell - or just rage-flip your desk over and rewrite everything in Perl? Should you rewrite your architecture first, or your build process? And how do you show the business side of things that spending hundreds of hours on technical debt is actually worth it - even if you’re not adding any functionality?

In this talk, you will learn the WHY and the HOW of each building block of the upgrade process for your application. I find that when teaching (rather than simply presenting information), if you can convey the thought process behind WHY you did something the way you did, as well as the payoff for making that decision, you get a greater understanding, acceptance and application of the student learning.

This is the meta-level talk I wish I had seen a couple of years ago: a toolbox I could use to identify the gaps in our app’s architecture and tooling, but also how to balance it against our budget and time constraints. Instead, I just had to throw stuff at the wall and see if it stuck - and try not to get fired along the way. The talk will include a game plan cheat sheet you can work through on your own and show your boss or your teammates.

Slides

RxJS schedulers in depth

Presented by Michael Hladky

Is an observable executed synchronously? You might think you know it, most people don’t. In this talk, I’ll introduce you to the world of schedulers, its secrets and advantages. I will show you how to use them in basic cases, as well as advanced scenarios.

After this session you will master smooth animations, solving complex timing errors and controlling execution context like an expert. And all this with schedulers.

Slides

How to AI in JS?

Presented by Asim Hussain

There are many exciting things happening with AI, from which, until recently, JavaScript developers were largely shut out. But things are changing, if you can do npm install @tensorflow/tfjs or make an API call, you can now do AI.

In this fast-paced talk, I’ll open your mind to what’s possible by demoing several AI-powered JavaScript apps and show you how I built them using either TensorFlow.js or easy to use AI powered APIs.

You don’t need a PhD in Maths, you don’t need years of experience, you just need imagination and the willingness to try.

The good, the bad and the ugly - Component architecture at scale

Presented by Ana Cidre and Sherry List

In this talk, we show the correct way to construct Angular components by deconstructing a number of existing components. Through examples that categorise as “the good”, “the bad” and “the ugly”, we will look at common pitfalls and how you can avoid them. This way we will end up with simple, testable and highly reusable components. Join us on this adventure!

Slides

You Might Not Need NgRx

Presented by Michael Ryan

NgRx is a Redux-inspired framework for Angular applications. It manages state and side effects, helping you build applications that are easier to test, strongly typed and more performant; however, these benefits can add complexity. Luckily, there are a set of hard rules and principles that will guide you through these tradeoffs.

Universally speaking

Presented by Craig Spence

WHHHHOOOOOSSSSSSHHHHHHHHHH!!!!!!

Did you hear that!? It’s the sound of a blazing-fast Angular Universal application, rocketing it’s way straight to a users’ device! Angular Universal promises a solution to all the super hard problems - improved first render performance, search crawler support, and server-client state-transfer… but what does it really look like in the real world?

Let’s explore what is actually involved in getting Angular Universal up and running, as we go through some of the lessons learned from moving a big Angular application to the server. Come to unlock the secrets of the universe, as we explore how to launch our Angular apps to Infinity and beyond!

Slides

Upgrading to Angular without ngUpgrade

Presented by Erin Coughlan

Many apps can install ngUpgrade and begin rewriting components, but it’s not so easy when those components make up a library that is used by several teams to power their production apps. Instead of rewriting everything at once, this talk shares how we first created a common interface with custom elements, and then upgraded one component at a time to Angular Elements.

Slides

Optimize and debug change detection like a pro

Presented by Max Koretskyi

Change detection is the key area affecting an application’s performance. It’s where most of the optimization efforts like using OnPush strategy are put. But using optimization strategies without solid understanding of the change detection process is tricky and can cause inconsistent behavior. Also insufficient knowledge often leads to a painful experience when debugging Change Detection errors, like ExpressionChangedAfterItHasBeenChecked. In this talk, I’ll use simple concise examples to present the change detection mechanism under the hood. We’ll also take a look at how an existing implementation has been improved in Ivy. By the end of the talk, you’ll have enough knowledge to choose the right optimization technique and even come up with new techniques yourself. What you’ll learn from the talk will also help you debug change detection errors much faster and fix them in a proper way.

Why you need a build system, and why it should be Bazel

Presented by Martin Probst

Traditionally, we’ve built web apps with little more than a few files scattered around the disk. Then came development servers, and transpilers, and assemblers, and everything was a mess of plugins. This talk walks you through what a build system is, how it helps you organize your software development flow, and what properties to look for in a good build system.

Slides

Nest the backend for your Angular application

Presented by Bo Vandersteene

Are you experienced with Angular, but you also need to do some backend work? Why don’t you choose a framework that has the same terminology and is also offers typescript support? How can these two frameworks integrate with each other, and run on the same server?

Slides

The Theory of Angular Ivy

Presented by Alex Rickabaugh

This talk will provide an understanding of the core principles Ivy is built around. Look at the instruction architecture, component factories and injection, and the locality principle. You will leave the talk with the basics you need to get started with Ivy.

Slides

Testing Angular with Cypress.io

Presented by Joe Eames

Cypress.io has emerged as a strong competitor to Protractor and WebDriver. It has a unique set of features that make it a great choice for end to end testing with Angular. In this session, we will see how to write tests against our Angular apps, and leverage the power of Cypress.io.

The differences between ElementRef, TemplateRef, ViewContainerRef

Presented by Ashnita Bali and Marcin Ryzycki

This talk walks you through how to create dynamic components and custom templates using the view container API and using the NgComponentOutlet or NgTemplateOutlet directives. It demonstrates how to create dynamic components using the brand new feature, Angular Elements. The talk explains the relationship between structural directives, ng-template, the HTML template element and template reference variables and explains terminologies such as host view, embedded view, view container. It also covers using the platform agnostic Renderer service for DOM access.

Slides

Building an Angular PWA: Angular Service Worker or Workbox?

Presented by Maxim Salnikov

There is no doubt that 2018 is the #YearOfPWA. It’s the year when Progressive Web Apps will get the really broad adoption and recognition by all the involved parties: browser vendors (finally, all the major ones), developers, users. Angular developers are lucky to have some really nice options to automate their PWA’s main functionality exposed by Service Worker API. The first option is 100% native to the Angular and created by the Angular team: Angular Service Worker. The second one is a framework-agnostic library called Workbox.

Both approaches are robust, convenient and unique! Let’s go through the main features of PWA implemented using NGSW vs Workbox and the resulting application lifecycle management. After the session, everyone will give their own answer on what’s easier to start with, which library is simpler to use, which resulting PWA is more convenient to maintain.

Slides

Location based immersive experiences with Angular and WebXR

Presented by Aysegul Yonet

Geolocation and Augmented Reality (WebXR) are tools we can use to create engaging experiences in mobile web but great user experiences require your apps to be fast. Angular makes it easy to write reusable components that integrate such experiences in a seamless way. Join me as I explore the capabilities of Geolocation and WebXR APIs and how they can enrich your applications while writing reusable and performant Angular components.

Angular Testing In TDD - Writing a Feature Guided By a Responsible Maniac

Presented by Shai Reznik

“Yes, one day we will test our code, just not now, soon, right after this next release… we promise…”

Hi, My name is Shai Reznik and I’ve got an interesting business opportunity to discuss with you. At the end of the day, we all want to feel more confident in our code stability and design so we could make changes without the fear of breaking something. There’s a cure - it’s called Test Driven Development and it’ll save your life. Don’t believe me? I’ll show you, wait and see.. We’ll develop a real feature together… then you’ll see… yeah… you will… I’ll also share a few new testing techniques I’ve been working on that will jump start your way into testing success, a great love life, worldwide fame and a multi-billion company with lots of profits and money!

But mostly testing success… And money. And a hug No? Why not? Come on… There you go! That was a good hug! Now you can go… Go I tell you, go have fun! Don’t worry about me, I’ll be fine. Just come and watch my talk and convince 10 other people to watch it too. In the meantime, as a preparation, watch the free Unit Testing theory course on HiRez.io (so you’ll know what we’re talking about) OK, Bye! Mom.

Lightning Talks

Presented by a group of individuals

Day Two (2018)

Angular Ivy by example

Presented by Jason Aden

Ivy opens up a whole new world of options for developing Angular applications. Some of these new options include dropping dependency on Zone.js, or developing without dependency injection. Or how about building custom templates or higher order components? See these examples and more in Angular Ivy by Example.

Automate G Suite with Apps Script and Angular

Presented by Grant Timmerman

Google Apps Script provides a layer of abstraction for interacting with Google APIs, from Gmail to Google Sheets and Calendar. Angular provides a complete client-side solution for web applications. In this talk, I’ll show you how together, with Apps Script and Angular, you can build powerful web apps to automate tasks in minutes.

Migrating from AngularJS to Angular

Presented by Elana Olson

It’s been two years since NgUpgrade was first introduced, and there are thousands of companies upgrading from AngularJS to Angular, developing new patterns and best practices. Elana has spent the last six months digging deeply into the experience of migration from AngularJS to Angular, talking with developers and companies from all over the community. She will share her insights about the challenges and success that come with the various tools and strategies.

She will cover two new tools recently released, ngMigration Assistant and ngMigration Forum. These tools are designed to improve the migration process and guide Angular developers to a better migration experience. Check out this article to learn more about these awesome new tools.

Dynamic reactive forms with GraphQL

Presented by Juan Stoppa

One of the most challenging requirements when building enterprise web applications for financial services is capturing large amounts of information through user input, this information is normally typed in large forms that contain a dozen to hundreds of fields with complex validation logic and multiple dependencies on field’s completion. This talk will explain the design behind a framework that fixes it elegantly, using reactive forms, dynamic component loader and GraphQL.

Climbing up injector trees

Presented by Uri Shaked and Kapunahele Wong

Dependency Injection is at the heart of Angular. We don’t even think about it too much — we ask for a dependency, we get it. However, once our app grows and we have multiple NgModules, lazy loading and use third party components, things start to get more complex. In this session, you will learn about ElementInjector and ModuleInjector, how they work together, and the two-pass dependency resolution process. Did we mention it is going to be fun? 💉🌲

Slides

The life of an Angular pull request

Presented by Manu Murthy

The Pull Request is the unit of change and the outcome of the work that goes into Angular. We start with the outcome and look at the processes and milestones that help us achieve that outcome.

Slides

Architectures for huge Angular based enterprise applications: npm Packages, Monorepos and Micro Apps

Presented by Manfred Steyer

Nowadays, we build large enterprise applications with Angular. But how to best structure such projects to ensure long-term maintainability and reusability?

This session provides multiple answers to this question. We explore how to split large projects into individually reusable npm packages and how to deploy them through an internal and public registry. As an alternative, we discuss the Monorepo approach that is used successfully by big companies like Google and Facebook and which compensates for some of the disadvantages of npm packages in internal projects.

The use of micro apps is also discussed and implementation options, advantages and disadvantages are investigated. By the end the audience will know the options for architecting enterprise apps.

White-labeling & A/B testing with interchangeable components

Presented by Younes Jaaidi

Most Angular applications need to customize their display, features and behaviour depending on multiple and complex criteria serving different use cases like white-labeling, A/B testing or progressive deployment.

In this talk, I will show you how to architect your Angular apps by providing loosely coupled and interchangeable components that will allow you or even your applications’ end-users to customize the application experience dynamically by simple configuration (and without any switch/case).

The CLI Roadmap

Presented by Filipe Silva

Want to have a glimpse into what the CLI and DevKit have in store in the future? Join Filipe to look at the latest and upcoming features. Go through the concrete situations where Bazel is helpful for small, medium and large projects, and see how you can convert your CLI project to using Bazel today (experimental, many caveats apply!).

Slides

It’s alive! Dino-mic components in Angular

Presented by Shmuela Jacobs

The main use-case for using dynamic components is when we can decide only in run-time which component is loaded. They’re also the only solution when we want to embed Angular components in non-Angular ones. In many cases, replacing in-template components with dynamic ones is beneficial to performance and code quality. In this talk, we’ll learn how to create and use dynamic components, and discuss several types of usages.

Runtime i18n with Ivy

Presented by Olivier Combe

With the new rendering engine (Ivy) we’ve finally been able to work on a full revamp of i18n (internationalization) for Angular. Translations are now handled at runtime which brings a lot of benefits: one bundle for all languages, service for code translations…

In this talk we will review the design choices, the changes and the benefits of this new approach

Crossing Across Platforms

Presented by Sani Yusuf

Web, Mobile & Desktop are the 3 standard platforms we develop for today especially in the Enterprise world. Each platform has its own unique features and needs. When faced with requirements where we need to develop one application for all 3, it can be a nightmare to get it right. How do you share code effectively? How do we solve a white labelling requirement? In this talk, I will show you based on a real-world Enterprise Healthcare application on how Angular can be the glue for such a monumental task where we will end up with a Mobile Solution, A Web Responsive Solution as well as a Desktop solution with electron while using 100% the same code base.

Angular Panel

Presented by the core team

Day One (2017)

Keynote

Presented by Jules Kremer and Igor Minar

Slides

Automatic Progressive Web Apps using Angular Service Worker

Presented by Maxim Salnikov

Progressive Web Apps are the next big thing for the web. They combine the advantages of two platforms: searchability and shareability of the web with capabilities and performance of native mobile. As a result, web developers can use their favourite tools to build installable, re-engageable, connectivity independent apps, that can bring native-like performance and user experience.

The Angular Service Worker makes it easy to get started building PWA. It’s developed to automate main routines and provide us with some nice tools to control the progressive app behaviour. During this practical session, we’ll have a look at NGSW’s main components, and how they take our web app to the next level. With just some simple updates we’ll get installable, offline-capable, mobile-network-friendly Angular app re-engaging users by push-notifications.

Slides

Internationalization: New and Upcoming Features

Presented by Olivier Combe

Making an application in multiple languages is already such a complex and tedious task that you shouldn’t have to worry about all of the technical details. It should all be handled by your framework. Angular is finally catching up on the essential i18n features that you need for your applications and libraries. I will show you the new and upcoming features of Angular v5 and explain the challenges that it will solve for you.

Slides

From Buildings to Software - Paving the Way to Construction

Presented by Katerina Skroumpelou

As an architectural engineer by training, and working as a web dev for the past couple of years, Katerina will explain how architecture has defined the way she designs web apps and pages and how Angular has supported her in organising content.

“A web page for me is like the facade of a house. From day one into web development, I looked at apps as if setting down plans for a new building. The process, like the process of building from the ground an establishment. I want to talk about scaffolding. I want to extend on designing the building blocks, the bricks made out of components. And as the construction is evolving, how materials fill in the empty spaces, making them consistent.”

Slides

Breaking The Eyes

Presented by Uri Shaked

We just need to type ng serve to see our Angular app running in front of our eyes. But what about those who can’t see? How can we build an experience that is also relevant for sight-challenged people? In this session, we will do it differently. We are going to code without actually using browser - just a screen reader. What does the feel like? Can we make it better by adding some accessibility love to our app? Let’s figure it out together!

Introduction to Web Application Security

Presented by Dominik Kundel

Robert’); DROP TABLE Students;– The little Bobby Tables is embodying the classical fear of SQL injections when building web applications.

However, SQL injections are just one aspect of things we need to worry about when building web applications. With the recent popularity of Angular, React and other Single Page Application frameworks we got more logic executing on the front-end create new problems and make you forget about others.

In this talk, you will learn about XSS, CSRF, CORS, JWT, HTTPS, SPAs, REST APIs and other weird abbreviations, how to protect yourself and your users from the new generation of Bobby Tables.

Resources

Responsive Layouts with @angular/Flex-Layout

Presented by Ekaterina Orlova and Thomas Burleson

Regardless of the power of the Angular platform, developers always struggle UI component Layouts. Using Flexbox CSS, the HTML layouts becomes responsive to viewport size changes. HTML containers will auto-adjust their sizes and child elements will auto-adjust positioning and sizes accordingly.

But using Flexbox CSS is hard… and frustrating… and seemingly complex. You have to become a Flexbox CSS expert! Or do you? With @angular/flex-layout, developers have an Angular-native, HTML markup API that makes it super easy to layout their UI components. And the Flex-Layout will generate and apply, under-the-hood, the best FlexBox CSS for your needs.

And the Flex-Layout will generate and apply, under-the-hood, the best FlexBox CSS for your needs. Even better, Flex Layout has a Responsive API that makes it super easy to adapt the UI to different devices.

Hide or show components, change layout directions, change stylings… all super easy with @angular/flex-layout. Come to this presentation to learn more about @angular/flex-layout, how it compares to Angular Material, how it compares to Bootstrap CSS grids. Come to learn why this should be a critical new tool for your Angular developer toolbox.

Purely Fast

Presented by Minko Gechev

One thing is sure - performance matters! Blocking the main thread of an application, causing frame drops, is one of the most efficient ways to get rid of a significant portion of our users. Fortunately, the day could be saved, thanks to functional programming. Coming with, at first, abstract ideas, functional programming brings the concepts of immutability and purity, which combined together can dramatically improve the rendering performance of our application. In this talk, we’ll apply concepts from functional programming in the face of pure components, pure pipes and persistent data structures. We’ll demonstrate in details how we can use them to build high-performant Angular applications.

Slides

Accessibility Through the Eyes of a Deaf Professional

Presented by Svetlana Kouznetsova

People with disabilities make the largest minority comprising the market size of China, but their needs are sadly the most misunderstood and ignored. Accessibility is an important part of any projects and not to be used as an afterthought or as a separate part. Also, it’s everyone’s responsibility to make their products and services accessible regardless of the industry. Accessibility benefits everyone and not just those with disabilities - including businesses who can improve their bottom lines due to having more happy and loyal customers.

Sveta will share her personal experiences as a deaf professional and discuss some accessibility examples. Her presentation will be delivered in sign language, voiced by sign language interpreters, and captioned in real time to make it more accessible to a wider audience.

Slides

The Science of What Makes Us Tick

Presented by Alan Furlong

If you want your teams to be more engaged, empowered and motivated, if you’re wishing to improve your team or your own personal skills, this session will explain the science that reveals what makes people tick and practical ways to address those challenges successfully. In this interactive, fact-based and entertaining session Alan Furlong will explain the tectonic shifts that are occurring in the workplace today, why tech companies are at the leading edge of that change and as a consequence, why our personal, professional and leadership tool-kits are outdated and need an upgrade. What they share is fascinating research and case studies from positive psychology, neuroscience, social science, systems thinking and other disciplines that ultimately create an “ah ha” moment for anyone who has been struggling personally or with people issues.

Advanced Angular Concepts

Presented by Alex Rickabaugh

Angular is a powerful platform with the features you need to build large and complex web applications. Some of these features, though, are more well known than others.

Core team member Alex Rickabaugh will give a tour of Angular’s more advanced features, tricks, and patterns. Whether you’re looking to design more ergonomic and reusable components, optimize your app’s change detection, or architect for performance, beginners and experts alike can benefit from deeper knowledge of Angular’s advanced APIs.

From Donkey to Unicorn: A new approach to AngularJS migration

Presented by Asim Hussain

According to builtwith.com over 400,000 AngularJS apps have been created and released into the wild. In this talk I’ll present a new migration approach. One that works for even the most complex and challenging legacy AngularJS applications. One that works even if your AngularJS code is not up to todays standards.

One that works even if you are not already an SPA. One that works when you are migrating a number of other legacy libraries at the same time you are migrating AngularJS. If you have already tried migrating your existing AngularJS application and hit a brick wall, or are overwhelmed with the number of changes you’ll have to make to your existing AngularJS app to even begin the process of migration, then this talk is for you.

Exciting World of WebVR

Presented by Aysegul Yonet

As much fun as Facebook Spaces experience and watching a basketball game in Virtual Reality headset are, we have not witnessed the real power of WebVR yet.

Neuroscientists and doctors are discovering the how they can utilize WebVR for pain management, depression and Alzheimer disease. Tech leaders like Google is collaborating with teachers to create educational discovery applications to bring experiences to students all around the world that would otherwise never get to explore.

Smithsonian museum is scanning all of their archive for you to experience their collection in a way you have never done before. Join us connecting the world with this new technology. Let’s create your first Angular WebVR component and look at the amazing tools we have together.

Slides

Angular Dynamic Pages

Presented by Jesus Rodriguez and Ward Bell

The Angular pages you know are mostly static. They are fixed component trees, fully described by their templates. In Angular the component template and class are inseparable.

They are compiled together into a single execution unit during the build. It’s hard to imagine an Angular application that generates a runtime custom dashboard or a data-driven questionnaire … or the free-form pages of Angular’s own documentation at angular.io.

Can it be done? It is done! In the official, open-source, Angular documentation viewer, each document page is a unique blend of HTML content and Angular components​ drawn from a widget toolbox. A page can display any of the widgets, in any combination, placed anywhere on the page.

The documentation viewer itself has no idea what these pages look like. Learn how we do it and imagine how you can apply these techniques to build dynamic pages in your own application.

Slides

Pre-Rendering Strategies

Presented by Jeff Cross

Now that universal rendering support has landed in Angular 4.x, developers should evaluate how they can provide a better user experience by rendering page content before they’re delivered it to the browser.

There are many options to consider with pre-rendering, with many complex trade-offs to evaluate.

This talk will help simplify complexity, and provide a framework for thinking about how to best utilize pre-rendering in your applications.

Slides

Angular Animations: Motion Makes Meaning

Presented by Lukas Ruebbelke

We live in a world where context is often derived from forces such as gravity, friction, velocity, etc. which can determine the entire nature of a user interaction. These factors provide us with a considerable opportunity to direct a user experience to a successful conclusion by giving the right cues and setting the proper tone through motion. Angular Animations provides us with a way to express movement through a powerful yet natural DSL within our applications. In this talk, we will work through how to take a static application and bring it to life in easy, approachable steps so that you can apply the same process to your work.

Slides

ng-game-show

Presented by Shai Reznik

A Jeopardy-like gameshow which tests the darkest sides of Angular only a few know about. If you know, there are cool prizes, if you don’t… you’ll learn something cool.

Day Two (2017)

Keynote

Presented by Stephen Fluin

Angular Material Data Table

Presented by Andrew Seguin and Erin Coughlan

A look into the design process and implementation of Angular Material’s Data Table.

Come find out how we prototyped different designs to meet our requirements on performance and accessibility with a simple flexible interface.

Slides

Angular Elements

Presented by Rob Wormald

Angular Elements is an Angular Labs project that allows Angular developers to use the skills they know from building Angular applications and extend them to make reusable components. This session will provide you an overview of Angular Elements and walk through building one.

Slides

Four Way Data Binding With Angular & PouchDB

Presented by Sani Yusuf

In today’s world, mobile is the primary way we access the Internet for our very many important activities. The problem is a lot of apps work great online but become unusable offline. Imagine if you couldn’t search for previous emails on your mail app if you had no Internet connection? Creating an offline experience can be challenging with so many things to worry about like how best to sync when the internet comes back or how best to handle conflicts when multiple users change the same data offline? This talk will showcase how we can use PouchDB to achieve 4-way data binding by keeping the Model, View, Serve & Offline Data all in sync while providing the user with a mature offline experience.

Slides

Angular Forms

Presented by Kara Erickson

In this talk, we’ll start by discussing some helpful patterns for creating successful forms, from error message handling to on-demand validation. We’ll also review what’s new in Angular forms and what might be coming up next.

Slides

Components are the New Thin Clients

Presented by Bonnie Brennan and Lukas Ruebbelke

There is an acute sense of pain that developers experience as they try to reconcile complex user interactions and interpret the effect those actions will have on the overall application state. This generally starts out as a fairly painless journey, but as application complexity increases, so do the demands that we place on our components.

Let us imagine a scenario where the primary function of components is to expose just enough data for our templates to bind to and capture events to be passed along to a service. On a superficial level, it is obvious that these would be much easier components to work with, but what are some deeper implications of having all of our user events reduced to a series of actions and then broadcasted to the rest of the application? What happens if we bypass the components entirely and just start broadcasting those same actions directly into the application? What if we switched one view layer for another? Could one application share multiple views at the same time? If we know the actions a user takes and we can recreate them, does “time” really matter?

Beyond Angular CLI: DevKit and Schematics

Presented by Mike Brocchi, Filipe Silva and Hans Larsen

The Angular CLI has been very successful, but the Angular tooling does not stop there. The next evolution of the CLI is the Angular DevKit and Schematics.

In this talk, you will learn what the Angular DevKit is, how to customize the CLI with Schematics, how the new build system works and why this can help you as a member of the Angular community.

Slides

State Management Patterns and Best Practices with NgRx

Presented by Victor Savkin

NgRx is the default state state-management library for Angular. It’s simple and flexible, and, as a result, a lot depends on how you use it. Victor helps a lot of enterprise companies build large Angular applications with NgRx, and in this talk he will share some of the best practices and patterns that work well.

Mobx - Performance and Sanity

Presented by Adam Klein

The 2 major challenges for frontend apps these days are maintaining a sane architecture, and good performance. MobX introduces a great way to manage a reactive state with a single source of truth, using plain objects and decorators. This talk will introduce the idea and concept behind MobX, and how it can completely turn your web development process around.

Slides

Testing Angular apps. At scale.

Presented by Jan Molak

Angular became the framework of choice for numerous large-scale projects in the media, e-commerce, financial and banking sectors to name but a few.

However, even though the framework itself has changed and improved dramatically since it was originally introduced, the way we design the acceptance tests and the design patterns we use to do that is still stuck in 2009.

This makes it difficult to write E2E tests and use Protractor at scale, especially on projects where multiple teams are involved. In this talk I will demonstrate Serenity/JS, a TypeScript implementation of the popular Serenity BDD library, that lets you test Angular apps using the Screenplay Pattern and benefit from the powerful reporting features provided by Serenity BDD.

Combining the advantages of Protractor, the expressive Screenplay DSL, tooling support for TypeScript, and the powerful reporting features of Serenity BDD, Serenity/JS is set to become the tool of choice for your Angular automated testing!

Talk to Your App

Presented by Shmuela Jacobs

Technology has given us means to communicate with computers - interfaces such as keyboard, mouse, and touch screen. But when we look to the future, we expect a more natural, intuitive, agile way to use applications: speech. As you can see, the future is already here and voice driven interactions are becoming mainstream. Not only can voice driven interface upgrade our users’ experience, but it opens a world of opportunities for unique use cases. Shmuela will show you how you can leverage Google Cloud Speech API with Angular and Firebase to enable your application listen and respond to its users.

GCP: Migrating a 1M+ LOC project from AngularJS to Angular

Presented by Connie Wan and Jen Bourey

Google Cloud Platform’s migration story: technical, organizational, and practical considerations for migrating a large and growing project.

Manage Your Huge Codebase like a Boss

Presented by Jeff Whelpley

John Papa’s style guide has many great tips for managing code for your Angular app. But…what about when you are managing many different apps? Do you use one monorepo or many smaller repos? Where does your shared code live? How do you manage breaking changes across your apps?

In this talk, I will draw from my own experience to lay out the different options available and provide my recommendations for best practices with the management of many different Angular apps under the same umbrella.

Building Angular Applications like Google

Presented by Rado Kirov

In this talk, Rado will show you how you can build Angular applications using the same stack that Google uses internally. This includes AOT Angular compilation, the Bazel build system and the Closure optimizer.

GraphQL-Anywhere - Supercharge your NgRx store with GraphQL on the client side

Presented by Uri Goldshtein and Kamil Kisiela

We all heard about GraphQL, a powerful query language, for any data. But what if we could use that powerful query language to manage our local state between components? In this talk, Uri and Kamil will talk about the latest release of apollo-angular 1.0 and the new possibilities it brings to Angular applications, not only over the network but for your local data as well.

Day One (2016)

Keynote

Presented by Miško Hevery and Jules Kremer

Slides

Mobile apps? Trust no one… except me

Presented by Jeff Cross

This talk will help de-mystify the advantages, risks and trade-offs of the countless options for building mobile apps with Angular, and will provide some guidance to help you decide the right strategy for your next mobile application.

Slides

Secure your Angular applications

Presented by Gleb Bahmutov

What do Chrome extensions written in Angular and secure websites have in common? They take Content Security Policy seriously! In this presentation I will show:

  • how bad things happen to good people
  • how to switch from chasing the bad guys to protecting yourself
  • how to secure your web application against cross-site scripting attacks

Slides

Rescue your mobile experience!

Presented by Alex Rickabaugh

Your mobile app is in trouble. Villains like flaky networks, underpowered devices, and ever increasing application complexity conspire to make them slow and janky, and frustrate your users. Gain the power to fight back! Come learn the architectures, best practices, and strategies to vanquish poor performance and take back control over your user experience, once and for all!

Slides

Angular 2.0 Animations

Presented by Matias Niemela

The Animations system in Angular 2.0 is an advanced and powerful platform that makes use of the cutting edge feature set of Angular mixed together with web animations, CSS and layouts.

With the forthcoming release of the 2.0 version, the framework will be taking larger strides to manage more complex animation choreographies and UI state changes as well as layout effects.

In this talk we’ll explore how and where animations in Angular 2.0 are going and how the framework has evolved to take on these challenges.

Slides

One Code to rule them all: Cross-platform development with Angular 2, Cordova & Electron

Presented by Christian Weyer and Thorsten Hans

Bring your Angular 2 applications to any platform - no matter whether you think about web, mobile apps or full-blown desktop applications. See how to achieve the goal with just a single codebase by using famous frameworks like Apache Cordova and GitHub Electron. Join Christian Weyer and Thorsten Hans on the journey through the cross-platform land.

Slides

Angular Material 2

Presented by Jeremy Elbourn and Kara Erickson

Components are a critical part of the Angular Platform. Angular Material aims to give you the components you need to build a quality app in no time at all. Come hear the latest status update directly from the team and get a sneak peek at what is coming.

Slides

SEO best practices and requirements for modern sites

Presented by John Mueller

Web-Search is a critical way of attracting new and previous users to many websites. Traditional websites deliver a page’s full content directly in the HTML file, which makes them easy to crawl and index for search. What do you need to watch out for to make modern websites, such as those built on Angular, work well for Google Web-Search? Find out more about Google’s requirements and recommendations, and get tips on diagnosing potential issues along the way.

The Angular 2 Compiler

Presented by Tobias Bosch

The Angular 2 Compiler takes your modules, components, directives, pipes and templates and brings them to live. In this talk I will explain how the compiler works, the challenges we faced while building it and what we learned along the way. A special focus will be on how we made Angular 2 fast. #compiler #performance

Slides

Cross Site Request Funkery: Securing Your Angular Apps From Evil Doers

Presented by Dave Smith

The web is full of exploits, and CSRF is one that every web app should protect itself from. This talk will explain how CSRF works and how Angular’s HTTP stack can protect you from it.

Why common sense is not enough: user testing and prototyping

Presented by Ekaterina Orlova

Common sense is not enough - always check if you and your users talk the same language. This talk will explore how early prototyping (Angular & NodeJS) and continuous guerilla testing discovers the gaps between developers’ and users’ expectations - focusing on the success story of ‘Min Bedrift (My enterprise) 2.0’, self-service solution for corporate customers of Telenor, one of the largest mobile carriers in the world.

Building Progressive Web Apps and Hybrid Apps with Ionic

Presented by Adam Bradley and Brandy Carney

The team at Ionic has been a proponent for the web since the very beginning. The Ionic Framework was originally created to help web developers become mobile developers, but it has quickly become so much more. With the recent rave surrounding Progressive Web Apps, Ionic is the ideal solution for developers who, alongside building hybrid apps, also want to deploy to the mobile web, or even desktop web, using the same code base. We’ll discuss how easy it is to create a high performant Ionic app using one code base that runs on the desktop web, mobile web, native app stores, and more. Along with Ionic’s ability to be distributed across different channels, we’ll also go over how Ionic can automatically adjusts its design so it feels right at home to the end-user. With Ionic 2, theming has become simpler than ever with three unique design modes: Material Design, iOS, and Windows, that can each be customized to fit your brand.

Slides

Go beast mode with realtime reactive interfaces in Angular 2 and Firebase (observables)

Presented by Lukas Ruebbelke

Angular 2 is built with reactive mechanisms baked right into the framework. State change happens in one place in your application and it is automatically streamed through your components and to your views. What happens when we extend the equation to handle streaming data from the server to everyone’s views? It is hard not to get power drunk on the beast mode!

Redux with AngularJS

Presented by Pavithra Kodmad

AngularJS has now been around for more than 2 years. That means there are behemoth apps that are written in Angular 1.0 and desperately require a facelift. If you are stuck maintaining such an application, like I was, this talk will help you to incrementally add ES6 and Redux to your application to make it modern and maintainable.

Slides

Storytelling with your data

Presented by Aysegul Yonet

Angular2 comes with great performance improvements and better tools than ever to build interactive data visualizations for the web. Check out how you can leverage ngAnimate, RxJS and Angular2 change detection to tell a story 60fps.

Slides

Optimizing Angular 2 Apps

Presented by Martin Probst

Minification used to be a topic for library developers who distribute a foo-min.js script for users to drop into their page. With ES6 modules, we can do better, by minifying the entire application along with its dependencies into a single .js bundle. We will cover the tooling pipeline, from Angular’s template compiler, through tree-shaking, bundling, and minification.

Slides

Learning the New Tech Lingua Franca: Social Media

Presented by Tracy Lee

Whether you are a developer or business person in the tech community, you must understand the lingua franca of the tech community: social media.

Business no longer gets done behind closed doors, but online through various mediums such as Twitter and Github.

This talk walks you through the reasons to have a presence as a developer, recruiter, CEO, or marketer and why communicating through social mediums is required for you to succeed.

We’ll talk about the do’s and don’ts of interaction and walk through a practical approach to building your social presence.

Why I am betting my future on Angular 2

Presented by Shai Reznik

As developers, team leaders, CTOs etc, we are like gamblers.

Every couple of years we’re gambling on a new technology stack that we hope will survive the test of time.

But you see, I’m more like a poker player.

And in poker, it’s not only about the cards you’ve been dealt, it’s also about the entire room, the people you play with, what were the last 20 moves being played, and 50 other factors that you take in consideration before you make your move.

I’m betting ALL IN on Angular 2 for the next few years, and this is why…

Neural Networks and Machine Learning. Building Intelligent Angular Applications

Presented by Carmen Popoviciu

You think that ng2 apps are cool, but we think there’s something even cooler: Smart ng2 apps!

A few months ago people were saying that the AI and ML future is still a few years away. But that is not true. That future is NOW and it’s EXCITING!

Neural Networks and Machine Learning are not a trivial subject, but we believe they are an absolutely fascinating subject that challenges us not just as developers or creators but also as thinkers and envisioners of our future.

Just close your eyes for a moment and try to imagine how it all works and looks like…

Fascinating right? And you don’t even know the half of it! But we would definitely like to show you!

Slides

Day Two (2016)

Keynote

Presented by Igor Minar and Rob Wormald

RxJS 5 - Thinking Reactively

Presented by Ben Lesh

Do you find yourself lost trying to choose the right operator to compose your observables? Do you struggle with how to structure your observable chains?

Do you feel like you’re almost there, but you’re just missing something? Don’t worry, we’ve all been there, even the “experts”. So let’s get started down the path to being an Rx expert!

In this talk, I will discuss common patterns and practices you can use in RxJS with Angular 2, or any other framework, to make your life easier. I’ll also go over some common gotchas and problems and how to get around them. Hopefully you’ll leave this talk knowing how to “think reactively”

Move, shake and drop with NativeScript and Angular 2

Presented by Jen Looper

Writing mobile apps is hard enough, but when you need to include an integrated web site with your native mobile app, things really get crazy. Partnering an Angular 2 codebase with a NativeScript app, however, can create beautiful music.

In this session, you’ll spin up a native mobile app using NativeScript where you will create sketches paired with Soundcloud music tracks. At the same time, using shared code between web and mobile, you’ll create the matching web presence to display the audio visualization you created on the mobile app to build your own custom PocketRave!

This session will showcase the magic of Angular 2 enhanced with a NativeScript-build mobile app, all songified with Soundcloud, and visualized on the web, with a special treat at the end to complete our sound and light show!

Angular 2 Forms

Presented by Kara Erickson

Forms are a staple of any application, but they can be complex to build. Learn how to leverage Angular’s new forms module to simplify your forms code. We’ll review both template-driven forms and reactive forms, from beginner to more advanced use cases.

Slides

Angular Community Up & Running

Presented by Shmuela Jacobs and Nir Kaufman

No CLI for this yet… How do you set up an active Angular community? From idea to deployment, from motivation to product, Shmuela and Nir will tell the journey of building up an active group of Angular 2 coders - beginners and experts, which not only develops but also gives back.

Angular CLI

Presented by Stephen Fluin

The CLI makes getting started with Angular much simpler. Learn about creating and running projects with the CLI, and understand what the CLI is doing under the hood.

From .component() to @component()

Presented by Todd Motto

The atomic building block of Angular 2 applications is the component. The entire architecture is built around component composition and a clear API for communicating events and state through your component tree. This allows us to create stateless components with deterministic rendering which lead to a profound reduction of moving parts in your application. The magic of this brave new world in Angular 2 is that it can be applied perfectly to our Angular 1.x applications. We will take journey from angular.component to @Component and in the process learn how we can use Angular 2 to write the absolute best Angular 1.x applications possible.

VR Video with Angular 2

Presented by Raul Jimenez

If you haven’t noticed, 360 & VR video is here to stay.

In this talk I’ll show you how to create engaging experiences with 360 & VR as a new video format for your customers by mixing Three.js and Angular 2.

It is highly recommended to bring your own Google Cardboard and some pop-corn!

The Angular Router

Presented by Victor Savkin

Managing state transitions is one of the hardest parts of building applications. This is especially true on the web, where you also need to ensure that the state is reflected in the URL. In addition, we often want to split applications into multiple bundles and load them on demand. Doing this transparently isn’t trivial. The Angular router solves these problems.

Slides

Look Deeply Into Your App with Augury

Presented by Igor Kamenetsky

Augury is a Chrome Developer Tools extension that allows developers to visualize their Angular 2.0 application’s component tree and the data associated with it. Our goal with this project is two-fold: help developers find bugs in their Angular 2.0 applications but also allow them to visualize their applications and their higher level structure at runtime. Our long term vision is also to help developers optimize the performance of their application using this tool.

Augury itself is an open source effort started at Rangle.io and is developed using TypeScript and Angular 2.0.

AngularJS in industry: Developing responsive aviation weather products with an agile, cross site team

Presented by Elizabeth Robinson, David Hunter and Dave Balderstone

A co-presented talk by Purple Secure Systems and the Met Office walks the audience through a case study of the development of a suite of responsive AngularJS projects to deliver the latest aviation weather data to the aviation industry.

The speakers will cover how a cross-site, dual organisation agile team upgraded three existing flex products over the last couple of years to AngularJS webapps. Starting with zero Angular experience for the first product, the speakers will discuss their lessons learnt and how they were able to apply their experience gained in the subsequent projects.

One of the main features of these apps is the “common map” component. The component combines AngularJS and OpenLayers3 to visualise observed and forecast weather layers. The architectural design of this component will be visited, addressing how it was designed for use across multiple Met Office products, using existing web services.

Testing Angular 2

Presented by Julie Ralph

Let’s talk about the most up to date tests for Angular! We’ll discuss recent changes in testing setup for Angular2, how it works behind the scenes (with a dip into Zone.js), and some strategies for making robust, useful test suites.

How fast can web-apps be?

Presented by Tim Ruffles

We hear lots about the performance of various frameworks, but how fast can a browser-based app be? We’ll dig into JS performance, rendering, network and understand the upper limit on your app’s performance.

Slides

Connect your Angular app to any existing backend with GraphQL

Presented by Uri Goldshtein

GraphQL was born inside Facebook and is quickly becoming a new standard for fetching data to web and mobile clients.

It has many benefits comparing to REST like performance on the network and easier maintainability.

In this talk you will learn what GraphQL is, why is it great for Angular developers and how to easily integrate it with your Angular applications, no matter which backends you need to connect to and how many backends you have.

Universal Tooling

Presented by Jeff Whelpley

With great power comes great…complexity? You can do so many new and amazing things with Angular 2 that just aren’t feasible with Angular 1, but the tool chain required to get it all working can be daunting. The mental hurdles to overcome can be even worse when you add Angular Universal to the mix and have to consider running your app on multiple platforms (i.e. in the browser and on the server).

Fortunately, the Angular core team and many Angular 2 libraries (including Angular Universal) have started to place a much bigger emphasis on the CLI and simplifying the tool chain in order to make setup and maintenance much easier.

In this talk, Jeff will go over the Angular Universal CLI integration and discuss several supporting services that you should be using when you render your Angular 2 app on the server.

Slides

Testing for accessibility in Angular 1 and 2

Presented by Marcy Sutton

If you’re using Angular, you’re well positioned to add accessibility tests in your development workflow. In this talk, I’ll show you how to leverage open source accessibility tools to improve software quality for everyone, including people with disabilities.

Slides

Day One (2015)

Keynote

Presented by Brad Green, Igor Minar and Jules Kremer

Slides

What’s new in TypeScript

Presented by Bill Ticehurst

The quality of a craftman’s tools are an important piece of doing a good job. In modern JS, the quality of our tools allows us to write even better apps with more confidence in the finished product. In this talk, Bill will be talking about improvements in the TypeScript toolchain, compiler, and language, and how they help you write better Angular apps.

Building cross-platform apps with Ionic 2

Presented by Adam Bradley

The Ionic and Angular teams have been working in parallel to extend Ionic’s performance in even more exciting ways than previous versions. We’ll review the new features of Ionic 2 and walk through the process of building a practical and highly performant app, using a single codebase for multiple platforms.

Slides

Angular 1.5 and beyond

Presented by Pete Bacon Darwin and Lucas Mirelmann

The latter part of 2015 is going to be exciting times for Angular as version 2 approaches production.

While AngularJS 1 continues to provide a solid development framework for hundreds if not thousands of live applications around the world we are looking at the future and how people might choose to upgrade from AngularJS 1 to Angular 2.

Angular 1.5 will include a number of changes that will support and encourage upgrading, as well as loads of bug fixes and useful features. In this talk, find out from two of the core AngularJS developers exactly what to expect in the next big AngularJS release.

Slides

Full-Stack Angular 2

Presented by Jeff Whelpley and Patrick Stapleton

Angular is no longer just a client-side framework. You can use Angular 2 core and many of its related libraries on the server. This opens the doors for some interesting possibilities. In this talk, Jeff Whelpley will demonstrate how you can most effectively leverage all of the awesome tools that are now available in Angular 2 to build ultra-fast, powerful full-stack applications.

Routing in Eleven Dimensions with Component Router

Presented by Brian Ford

Component Router is a futuristic routing system for Angular 1 and 2 that may or may not have been constructed from recovered extraterrestrial technology. We’ll show how it helps organize your application, explain the linking DSL, and show how to make use of lifecycle hooks. Then we’ll talk about advanced features and auxiliary routing.

Slides

Creating WebGL components with Angular

Presented by Aysegul Yonet

3d web ui is not a thing just seen in the movies anymore. Let’s see how we can bring two of the great web technologies together, Three.js and AngularJS to create 3D components. While Three.js makes it easy to work with 3D objects, shaders and cameras, Angular lets us encapsulate the functionality into reusable components and customise in a declarative way.

Extreme Programming in a Nutshell

Presented by Rachel Davies and Vikki Read

Description: We work in the fast paced world of social video advertising, where we find eXtreme Programming (XP) helps us to deliver new features with confidence. XP is a team based approach, developing code in pairs helps us learn from each other at the same time as spotting problems quickly. We also invest in automated tests and monitoring to ensure all our features continue to work as expected. Come to this session to hear about how XP can help you develop code you can be sure works and have fun at the same time.

Slides

“Write once, run anywhere” with nw.js & Cordova: for real!

Presented by Christian Weyer and Manuel Rauber

See AngularJS in action beyond web applications in the browser: Let’s build an application that integrates with iOS, Android, Windows Phone and the major desktop platforms – with the help of nw.js and Cordova tooling. And still runs in the browser. Go!

Getting started in Angular 2

Presented by Rado Kirov and Naomi Black

A practical hands-on tour of Angular 2 key concepts! You’ll learn how cross-component communication, data rendering, user input handling, and url routing all work together as we build a functioning app.

Slides

Biological Modelling, powered by AngularJS

Presented by Gil Fink

Scalable Vector Graphics (SVG) is a markup language that enables the building of two-dimensional vector graphics in the browser. Combining SVG and AngularJS can help you build very interesting models such as graphs, gauges and even biological models.

In this session you will get to know how SVG and AngularJS can play together. You will also see an example of a genome viewer that was built using both SVG and AngularJS.

Slides

ngAnimate 2.0

Presented by Robert Messerle, Matias Niemelä and Rob Wormald

Animation in Angular2 has been redesigned from the ground up to fit the needs of next-gen web applications. With this powerful new system, ngAnimate2 comes packed with a completely new platform for rich sequencing, extensive CSS manipulation, a solid plugin architecture and support for interactive animations via animation timelines. Learn more by seeing what ngAnimate2 has to offer and be one with the new animation paradigm shift!

Slides

Turn the performance knob to 11

Presented by Gleb Bahmutov

Once your Angular application has the features you need, the next step is usually focused on improving its performance, such as the initial load time and responsiveness to user’s commands.

The application has to execute quickly in order to be useful. Is the Angular framework fast or slow? I argue that it is very fast, but requires you to know how to measure and optimise the right bottlenecks.

Slides

Protractor styleguide

Presented by Carmen Popoviciu and Andres Dominguez

Many best practices and styleguides, such as the one by John Papa, have evolved in the Angular ecosystem along the years. These guidelines share the learnings of many projects in order to help developers of the community write better code and ergo, better Angular applications.

In our talk, we would like to introduce a similar styleguide that we have been working on, for e2e testing with Protractor. This project evolved from our individual work on creating a set of internal standards that would guide teams in testing their applications.

The talk will tackle some opinionated best practices for writing Protractor tests: naming conventions, selector strategies, page objects, helper objects, performance considerations and some more general concepts about e2e testing.

Angular 2 Data Flow

Presented by Jeff Cross and Alex Rickabaugh

Angular loves testability, and Angular 2 will continue to make it easy to write great test suites so that you’re confident in your site. Learn how to use karma and other tools to set up and debug tests, see how the Angular team creates their test suite, and meet new test helpers just for Angular 2 components.

Slides

Testing strategies with Angular 2

Presented by Julie Ralph

Angular loves testability, and Angular 2 will continue to make it easy to write great test suites so that you’re confident in your site. Learn how to use karma and other tools to set up and debug tests, see how the Angular team creates their test suite, and meet new test helpers just for Angular 2 components.

Slides

Becoming Betazoid: How to Listen and Empathize with Others in the Workplace

Presented by Joe Eames

Listening and empathy are things that we all sort of hand wave about. Most people think that empathy is something you have to be born with. When it comes to communication, we might think we’re good listeners, yet find that some of our relationships at work and even at home are suffering and we don’t know why. Listening and empathy are skills that anyone can develop, and they can benefit not only you, but those you interact with, and even the bottom line of your company. There are fewer things that make work more unbearable than difficult relationships. In this session I will show exactly what empathy is, and show you how to develop this trait to turn you into a great listener, which will help strengthen the bonds with those you spend your weekdays with.

Creating User Interface Component APIs in Angular and Web Components

Presented by Kara Erickson and Rachael L Moore

So you’ve embraced architecting your Angular application with reusable components – cheers to you! But you have UI components that need to communicate with each other or expose public methods, and you’re wondering about your options. In this talk, we’ll cover how new web component standards, like Custom Elements, handle this. Next, we’ll walk through how to accomplish it today in Angular 1.x – and bring it all together into what a solution will look like in upcoming Angular 2.

Iterative version upgrade strategies for large Angular applications

Presented by Jen Bourey

Learn how to bring the latest and greatest Angular technology to your project. We’ll focus on iterative upgrade strategies for in-production projects, learning how to adopt new angular versions and features without breaking existing code. Upgrade topics will include version upgrades (1.3->1.4 and 1.4->1.5), adopting the new Angular router, and a look forward towards upgrading to Angular 2. We will use real-world examples from the Google Cloud Developers Console, one of the biggest Angular-based applications at Google.

Building the Best Components

Presented by Jeremy Elbourn

The component is the new atomic unit of an Angular 2 application. So what makes a good component? This talk will explore how Angular 2 components are different from the directives you’re used to and provide some practical guidance on building them. We’ll also look at different types of tests you can write to guard against all kinds of regressions.

Slides

Day Two (2015)

Building native mobile apps with Angular 2.0 and NativeScript​

Presented by Sebastian Witalec

NativeScript is a free and open source JavaScript framework for building native iOS, Android, and Windows Phone apps, which you can use with Angular 2.0. But I know what you’re thinking: another way of building apps? What makes NativeScript special? Here are a a few cool things:

  • Direct access to native APIs—no plugins required. Want to create a file on Android? Run new java.io.File()—in JavaScript!
  • Completely native performance through the use of a JavaScript bridge natively available on all three mobile platforms.
  • Cross-platform libraries for common use cases. Need to call a JSON API? Run http.getJSON
  • Style native apps using CSS. Yep, that’s actually a thing.

Curious about how it all works? Come learn! Architectures will be explained; apps will be built; and fun will be had by all.

Modern authentication solutions with OAuth 2.0, OpenId Connect and AngularJS

Presented by Manfred Steyer

Nowadays every internet user has numerous passwords for different internet applications. The popular OAuth 2.0 protocol, supported by huge companies such as Google, Facebook and Twitter, promises to remedy this. This session shows what is behind OAuth 2.0, for which scenarios it is actually intended, where the dangers and challenges lie, and what OpenID Connect has to do with it. It also demonstrates how the standards mentioned can be applied together with AngularJS and UI Router, and the pitfalls of doing so.

These are not the models you’re looking for

Presented by Martin Gontovnikas

AngularJS gives us a lot of freedom at the time of creating our model objects. Most of us end up creating plain Javascript objects, which isn’t always the best solution. In this session we’ll learn how we can leverage Prototypes and Classes to make our models smarter and easier to use and maintain.

TypeScript tooling for greater productivity

Presented by Martin Probst and Alex Eagle

Learn how to be amazingly productive with Angular 2 & TypeScript. We’ll show how to organise your codebase, build up a development toolchain, and deliver a fast, working application.

Slides

Cutting Angular’s Crosscuts

Presented by Minko Gechev

No matter how DRY our code gets, there are times when the object-oriented paradigm is just not powerful enough to handle all code duplications. Applying logging and authorisation, for example, makes us copy and paste snippets all around our code-base without being able to isolate them in separate modules. This makes our code more coupled; less reusable and maintainable.

The aspect-oriented programming comes with a solution for such “cross-cutting concerns”. It is already widely used in the Java world, in AspectJ and Spring. In my talk I will bring the aspect-oriented programming paradigm to Angular. I’ll explain how to deal with duplications and make our code more maintainable using AOP with the new ECMAScript 7 decorators’ syntax.

Slides

Building performant components for AngularJS

Presented by Niall Crosby

Enterprise applications built on AngularJS typically have a data grid at their core. If you use AngularJS patterns all the way, your application can suffer in performance. This talk will explain the design philosophy that was followed to create an AngularJS grid that is lightning fast, yet AngularJS compatible. Such designs can be used to build other reusable components going forward, giving foundations for great AngularJS applications.

Modularity and packaging for Angular2 applications

Presented by Pawel Kozlowski

ES2015 modules are here to stay and Angular2 fully embraces them. Your applications can also take advantage of the new module system to better structure large code-bases, load modules on demand, avoid names collision etc.

But while ES2015 modules bring tons of improvements and new possibilities, they come with they own set of challenges. In this talk we are going to look into various strategies for developing, packaging and deploying fully modular Angular2 web applications. We will ponder pros and cons of each approach and try out different tools that allows us to use the module system from the future in today’s browsers.

Slides

Creating realtime apps with Angular 2 and Meteor

Presented by Uri Goldshtein

Meteor is an open source JavaScript application platform for building realtime web and mobile applications. Meteor is also the perfect backend for Angular 2.0 applications. In this talk, you will learn how to create a real time full-stack Angular 2.0 Meteor app in minutes. You will also learn about the details of the integration, the similarities between the philosophies of both platforms, and the future collaborations between the two.

Angular Material in practice

Presented by Thomas Burleson

The current state of Angular Material. See how our component building blocks work together with minimal code to create a real, working, adaptive UI for an app. Learn about our latest component additions, timelines, and how we’re getting ready for Material in Angular 2.

Slides

Sign up journey at Sky TV - building advanced forms for millions of users

Presented by Ricardo Mallols

AngularJS form handling capabilities are just amazing!

We’ll study a sexy way to display multiple kinds of (standard and non standard) input fields. We’ll analyse different strategies to validate them in a hierarchical, structured and scalable way, providing real time contextual feedback to the user in order to keep the best UX possible.

Using Web Workers for more responsive apps

Presented by Jason Teplitz

Angular 2’s split rendering structure allow us to automagically run most of Angular and your code on a separate processor core via Web Workers. See live demos, and find out how to get started on the early version of this feature.

Slides

Better concepts, less code in Angular 2

Presented by Victor Savkin and Tobias Bosch

Learn how Angular 2 makes hard problems simple by introducing new powerful concepts.

We will show it by building a complex widget in Angular 2 that will demonstrate features like content projection, querying for directives and asynchronous control flow.

Slides

How to design large AngularJS applications that scale

Presented by Sebastian Fröstl and Gernot Höflechner

We present design patterns for building large AngularJS applications. The central idea is to combine microservices with an underlying unidirectional data-flow and drastically reduce directive responsibilities. We are convinced that applying this architecture will also prepare your app for easier upgrading to AngularJS 2.

Slides

ngDarwinAward

Presented by Scott Moss

Optimize Yourself: 5 Key Traits of High-Performing Humans

Presented by Sylvana Rochet

You’ve got the technical skills, you’ve gotten the promotions, and you’re constantly taking on new challenges. Each new project requires you to learn new tools quickly and to work against the clock. How do you keep yourself sane, happy, engaged and performing at your best? This is where “holistic intelligence” skills come in handy. Don’t let the term fool you; this is simple stuff. I will teach you how to leverage accessible, every day traits that you can turn into high-octane tools for your career (and life!).

D3 in Angular, Angular in D3

Presented by Tim Ruffles

Do the interactions in your application feel tired? D3 will fix that.

But bringing D3 into Angular’s team will cause a ruckus. Both have exciting views on how to write apps. Unfortunately they’re polar opposites.

I want to save you from making the same mistakes I made, and tell you about how I finally resolved this clash of egos.

Debugging Angular 2 Apps with Batarangle

Presented by Yuri Takhteyev and Igor Krivanov

When debugging your Angular 2 apps, you don’t want to find yourself without tool support. Angular 1.x has Batarang. Angular 2 has Batarangle! Responding to a call from the Angular team, Rangle.io has started working on a Chrome plugin to help inspect Angular 2 applications. We are looking to combine the best ideas from Batarang, ng-inspector, React Developer Tools, and Ember Inspector as well adding a few extras. In this talk we’ll be showing our progress to date, looking a bit under the hood at the implementation, and also issuing a call for ideas, use cases, alpha users and contributors.

Building apps with Firebase and Angular 2

Presented by Sara Robinson

Firebase is a powerful platform for building mobile and web applications. Use Firebase to store and sync data instantly, authenticate users, and easily deploy your web app. In this talk, you’ll learn how you can use Firebase to add a backend to your Angular app in minutes. Sara will demonstrate how to get started with Firebase and Angular 2. At the end she’ll risk it all by live coding and deploying an app with Firebase and Angular!

Protractor, ES6 Generators and Co.js

Presented by Uri Shaked

Protractor is a great framework when it comes to testing your AngularJS applications, abstracting away many of the challenges connected with writing asynchronous testing code. In real-life, however, you usually have to call the database or perform other asynchronous requests, and this is where the Control Flows abstraction starts to break down.

In this talk we will learn how to use the new ES6 featured called Generators together with the Co library in order to achieve simple, predictable end-to-end testing flows.

RxJS In-Depth

Presented by Ben Lesh

Getting Comfortable Being Uncomfortable

Presented by Aimee Knight

There’s no denying that engineers are in high demand. Bootcamps are popping up everywhere, and while they’re churning out highly motivated juniors, often it’s seniors that companies are really after. So how do we bridge this gap together? On the surface it often looks like we’ve ‘naturally’ developed into our current roles. And, as we progress it’s incredibly easy to forget what it was like being new. Rest assured however, for most the journey has been filled with a whole lot of grit, determination, and discipline. In this talk, we’ll discuss lessons learned one year after going from a bootcamp grad, to a full time, full stack JavaScript developer. Plan to walk away empowered, and with renewed passion for the incredible industry we’re all a part of!