Sessions

Sessions

Keynote

ONE Day One at 09:40 to 10:40

Jules Kremer and Igor Minar

Jules KremerIgor Minar

View the slides

Automatic Progressive Web Apps using Angular Service Worker

ONE Day One at 11:20 to 11:45

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.

Maxim Salnikov

Maxim Salnikov

View the slides

Internationalization: New and Upcoming Features

TWO Day One at 11:20 to 11:45

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.

Olivier Combe

Olivier Combe

View the slides

From Buildings to Software - Paving the Way to Construction

TWO Day One at 11:50 to 12:15

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."

Katerina Skroumpelou

Katerina Skroumpelou

View the slides

Breaking The Eyes

ONE Day One at 11:50 to 12:15

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!

Uri Shaked

Uri Shaked

Introduction to Web Application Security

TWO Day One at 12:20 to 12:45

Session resources: http://bit.ly/onesie-life

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.

Dominik Kundel

Dominik Kundel

View the slides

Responsive Layouts with @angular/Flex-Layout

ONE Day One at 12:20 to 13:10

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.

Ekaterina Orlova and Thomas Burleson

Ekaterina OrlovaThomas Burleson

Office hours

FOUR Day One at 12:20 to 13:10

Maxim Salnikov, Stephen Fluin, Jules Kremer and Igor Minar

Maxim SalnikovStephen FluinJules KremerIgor Minar

Internationalisation and Accessibility

FIVE Day One at 12:20 to 13:10

Shmuela Jacobs, Svetlana Kouznetsova, Uri Shaked, Aysegul Yonet, Olivier Combe and Gen Ashley

Shmuela JacobsSvetlana KouznetsovaUri ShakedAysegul YonetOlivier CombeGen Ashley

Purely Fast

TWO Day One at 12:45 to 13:10

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.

Minko Gechev

Minko Gechev

View the slides

Angular Material Workshop

THREE Day One at 14:10 to 16:10

See how quickly you can build good-looking, highly functional applications from scratch using Angular Material and Flex Layout.

Elad Bezalel and Paul Gschwendtner

Elad BezalelPaul Gschwendtner

Tooling (CLI, ABC, testing)

FIVE Day One at 14:10 to 15:00

Hans Larsen, Mike Brocchi, Filipe Silva, Jan Molak, Rado Kirov, Joe Eames, Stephen Fluin and Simona Cotin

Hans LarsenMike BrocchiFilipe SilvaJan MolakRado KirovJoe EamesStephen FluinSimona Cotin

Accessibility Through the Eyes of a Deaf Professional

ONE Day One at 14:15 to 14:40

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.

Svetlana Kouznetsova

Svetlana Kouznetsova

View the slides

The Science of What Makes Us Tick

TWO Day One at 14:15 to 14:40

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.

Alan Furlong

Alan Furlong

Advanced Angular Concepts

ONE Day One at 14:45 to 15:35

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.

Alex Rickabaugh

Alex Rickabaugh

From Donkey to Unicorn: A new approach to AngularJS migration

TWO Day One at 14:45 to 15:10

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.

Asim Hussain

Asim Hussain

Exciting World of WebVR

TWO Day One at 15:10 to 15:35

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.

Aysegul Yonet

Aysegul Yonet

View the slides

Angular Dynamic Pages

TWO Day One at 16:15 to 16:40

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.

Jesus Rodriguez and Ward Bell

Jesus RodriguezWard Bell

View the slides

Pre-Rendering Strategies

ONE Day One at 16:15 to 16:45

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.

Jeff Cross

Jeff Cross

View the slides

Angular Animations: Motion Makes Meaning

ONE Day One at 16:45 to 17:10

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.

Lukas Ruebbelke

Lukas Ruebbelke

View the slides

ng-game-show

ONE Day One at 17:15 to 17:55

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.

To be in with the chance to compete for prizes and test your Angular knowledge on stage at AngularConnect 2017, fill out the application form.

Shai Reznik

Shai Reznik

Game of code workshop

THREE Day One at 18:30 to 19:20

Join Vincent Ogloblinsky for a "Game of Code" workshop and test the strength of your algorithm.

Go to battle, and pit your medieval avatar against a fellow AngularConnect attendee or the server’s AI.

If you would like to take part, visit https://coding-game.swat-sii.fr/?lng=en to create your avatar. Please ensure your AI is coded with your preferred language. Starter kits are also available (Node.js/RxJS, Node.js, PHP, Java).

What you need during the workshop: 
- a simple REST API to call
- an Angular application to watch in real time the fight

Don't forget to bring your laptop!

Happy coding!

Vincent Ogloblinsky

Vincent Ogloblinsky

Demo for VR Hero workshop

FIVE Day One at 18:30 to 18:35

Alex Castillo and Uri Shaked

Alex CastilloUri Shaked

Lightning Talks

TWO Day One at 18:35 to 20:05

The Discovery Stage is a space for showcasing future talent. 

This year our speakers Kristiyan Kostadinov, Jon Terje Aksland, Katerina Skroumpelou and Michael Smith will be opening the lightning sessions.

The lightning sessions are open to all delegates.  Anyone can sign up for a 3-minute lightning talk throughout day one of the conference.

The signup form will be located outside Saturn track. 

Lightning talks spaces will be available on a first come first serve basis, and the spaces are limited.

All we ask is that you bring your ideas with you to the conference and sign up early on the day to be considered for a slot!

Shai Reznik

Shai Reznik

Keynote

ONE Day Two at 09:10 to 10:10

Stephen Fluin

Stephen Fluin

Angular Material Data Table

TWO Day Two at 10:15 to 10:40

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.

Andrew Seguin and Erin Coughlan

Andrew SeguinErin Coughlan

View the slides

Angular Elements

ONE Day Two at 10:15 to 10:40

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.

Rob Wormald

Rob Wormald

View the slides

4 Way Data Binding With Angular & PouchDB

TWO Day Two at 11:20 to 11:45

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.

Sani Yusuf

Sani Yusuf

View the slides

Angular Forms

ONE Day Two at 11:20 to 12:10

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.

Kara Erickson

Kara Erickson

View the slides

VR Hero (Virtual Reality Workshop)

THREE Day Two at 11:20 to 13:05

Welcome to the amazing world of the Web, where everything is possible. In this session, we are going to combine Angular with cutting edge web technologies and create a Guitar-hero style game, but in a virtual reality world. We will use Web Bluetooth, Web VR, and Web Audio to live-code a unique game experience, with Alex adding some Neuroscience sauce to the mix.

Alex Castillo and Uri Shaked

Alex CastilloUri Shaked

Office hours

FOUR Day Two at 11:20 to 12:10

Rob Wormald, Andrew Seguin, Erin Coughlan and Igor Minar

Rob WormaldAndrew SeguinErin CoughlanIgor Minar

Migration (ngUpgrade, etc)

FIVE Day Two at 11:20 to 12:10

Asim Hussain, Pete Bacon Darwin, Georgios Kalpakas, Rado Kirov, Victor Savkin, Connie Wan and Jen Bourey

Asim HussainPete Bacon DarwinGeorgios KalpakasRado KirovVictor SavkinConnie WanJen Bourey

Components are the New Thin Clients

TWO Day Two at 11:45 to 12:10

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?

Bonnie Brennan and Lukas Ruebbelke

Bonnie BrennanLukas Ruebbelke

Beyond Angular CLI: DevKit and Schematics

TWO Day Two at 12:15 to 13:05

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.

Mike Brocchi, Filipe Silva and Hans Larsen

Mike BrocchiFilipe SilvaHans Larsen

View the slides

State Management Patterns and Best Practices with NgRx

ONE Day Two at 12:15 to 12:45

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.

Victor Savkin

Victor Savkin

Office hours

FOUR Day Two at 12:15 to 13:05

Kara Erickson, Sani Yusuf, Lukas Ruebbelke and Rado Kirov

Kara EricksonSani YusufLukas RuebbelkeRado Kirov

Advanced Angular (security, performance...)

FIVE Day Two at 12:15 to 13:05

Igor Minar, Maxim Salnikov, Alex Rickabaugh, Jeff Cross, Minko Gechev, Dominik Kundel and Justin Schwartzenberger

Igor MinarMaxim SalnikovAlex RickabaughJeff CrossMinko GechevDominik KundelJustin Schwartzenberger

Mobx - Performance and Sanity

ONE Day Two at 12:45 to 13:05

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.

Adam Klein

Adam Klein

View the slides

Code and Deploy Angular to the Cloud

THREE Day Two at 14:05 to 15:35

Getting started with Angular is now easier than ever ... said no one ever. Yet with the right toolset, we too can create magic. When I code with Angular I can deploy to Azure within minutes. We'll go through a simple development to production workflow. First, we code with a little help from the Angular CLI. Then we build for production - Webpack to the rescue. We then push our code to Github and deploy it on Node to Azure. Mission accomplished, the application is now up in the cloud!

Simona Cotin

Simona Cotin

View the slides

Office hours

FOUR Day Two at 14:05 to 14:55

Victor Savkin, Mike Brocchi, Hans Larsen and Filipe Silva

Victor SavkinMike BrocchiHans LarsenFilipe Silva

User Interfaces (forms, material, css, animation)

FIVE Day Two at 14:05 to 14:55

Thomas Burleson, Ekaterina Orlova, Erin Coughlan, Andrew Seguin, Paul Gschwendtner, Alex Castillo, Elad Bezalel, Kara Erickson and Katerina Skroumpelou

Thomas BurlesonEkaterina OrlovaErin CoughlanAndrew SeguinPaul GschwendtnerAlex CastilloElad BezalelKara EricksonKaterina Skroumpelou

Testing Angular apps. At scale.

ONE Day Two at 14:10 to 14:35

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!

Jan Molak

Jan Molak

Talk to Your App

TWO Day Two at 14:10 to 14:35

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.

Shmuela Jacobs

Shmuela Jacobs

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

ONE Day Two at 14:40 to 15:05

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

Connie Wan and Jen Bourey

Connie WanJen Bourey

Manage Your Huge Codebase like a Boss

TWO Day Two at 14:40 to 15:05

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.

Jeff Whelpley

Jeff Whelpley

Building Angular Applications like Google

ONE Day Two at 15:10 to 15:35

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.

Rado Kirov

Rado Kirov

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

TWO Day Two at 15:10 to 15:35

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.

Uri Goldshtein and Kamil Kisiela

Uri GoldshteinKamil Kisiela

Office hours

FOUR Day Two at 15:10 to 15:35

Connie Wan, Jen Bourey, Jeff Whelpley, Shmuela Jacobs and Jan Molak

Connie WanJen BoureyJeff WhelpleyShmuela JacobsJan Molak

Keynote

ONE Day One at 09:40 to 10:30

Miško Hevery and Jules Kremer

Miško HeveryJules Kremer

Watch the video  View the slides

Mobile apps? Trust no one... except me

ONE Day One at 11:00 to 11:20

Everyone’s got an opinion about how you should build mobile apps. "If you're not doing {Progressive Web Apps|Ionic|NativeScript|Cordova|React Native|Jeff's Beard|Pure Native} you're doing it wrong!"   

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.

Jeff Cross

Jeff Cross

Watch the video  View the slides

Secure your Angular applications

TWO Day One at 11:00 to 11:45

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

Gleb Bahmutov

Gleb Bahmutov

Watch the video  View the slides

Mini Workshop: New Data Architecture in Angular 2

THREE Day One at 11:00 to 12:45

Angular 2 introduces a new Data Architecture based on Reactive Programming using RxJS 5. We are really excited to see the new approach using Observable sequences aka Observables. We will cover a basic introduction of Angular 2 followed by RxJS 5 and the new HTTP API covering some basic use cases.

Gerard Sans

Gerard Sans

Rescue your mobile experience!

ONE Day One at 11:25 to 11:45

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!

Alex Rickabaugh

Alex Rickabaugh

Watch the video  View the slides

Angular 2.0 Animations

ONE Day One at 11:50 to 12:15

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.

Matias Niemela

Matias Niemela

Watch the video  View the slides

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

TWO Day One at 11:50 to 12:15

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.

Christian Weyer and Thorsten Hans

Christian WeyerThorsten Hans

Watch the video  View the slides

Panel Q&A: Architecture

FIVE Day One at 11:50 to 12:45

Ben Lesh, Miško Hevery, Uri Goldshtein and Victor Savkin

Ben LeshMiško HeveryUri GoldshteinVictor Savkin

Angular Material 2

ONE Day One at 12:20 to 12:45

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.

Jeremy Elbourn and Kara Erickson

Jeremy ElbournKara Erickson

Watch the video  View the slides

SEO best practices and requirements for modern sites

TWO Day One at 12:20 to 12:45

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.

John Mueller

John Mueller

Watch the video  

Panel Q&A: User Interface

FIVE Day One at 13:45 to 14:35

Jeremy Elbourn, Thomas Burleson, Matias Niemela, Aysegul Yonet, Kara Erickson and Marcy Sutton

Jeremy ElbournThomas BurlesonMatias NiemelaAysegul YonetKara EricksonMarcy Sutton

The Angular 2 Compiler

ONE Day One at 13:50 to 14:35

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

Tobias Bosch

Tobias Bosch

Watch the video  View the slides

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

TWO Day One at 13:50 to 14:10

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.

Dave Smith

Dave Smith

Watch the video  

Why common sense is not enough: user testing and prototyping

TWO Day One at 14:15 to 14:35

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. 

Ekaterina Orlova

Ekaterina Orlova

Watch the video  

Building Progressive Web Apps and Hybrid Apps with Ionic

ONE Day One at 14:40 to 15:05

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. 

Adam Bradley and Brandy Carney

Adam BradleyBrandy Carney

Watch the video  View the slides

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

TWO Day One at 14:40 to 15:05

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!

Lukas Ruebbelke

Lukas Ruebbelke

Watch the video  

Mini Workshop: Consumer IoT with Angular 2 Workshop (Part 1)

THREE Day One at 14:40 to 15:35

Gil Fink and Uri Shaked

Gil FinkUri Shaked

Panel Q&A: Testing

FIVE Day One at 14:40 to 15:35

Julie Ralph, Ekaterina Orlova, Carmen Popoviciu, Joe Eames and Gerard Sans

Julie RalphEkaterina OrlovaCarmen PopoviciuJoe EamesGerard Sans

Redux with AngularJS

ONE Day One at 15:10 to 15:35

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.

Pavithra Kodmad

Pavithra Kodmad

Watch the video  View the slides

Storytelling with your data

TWO Day One at 15:10 to 15:35

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.

Aysegul Yonet

Aysegul Yonet

Watch the video  View the slides

Optimizing Angular 2 Apps

ONE Day One at 16:05 to 16:50

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.

Martin Probst

Martin Probst

Watch the video  View the slides

Learning the New Tech Lingua Franca: Social Media

TWO Day One at 16:05 to 16:25

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.
 

Tracy Lee

Tracy Lee

Watch the video  

Mini Workshop: Consumer IoT with Angular 2 Workshop (Part 2)

THREE Day One at 16:05 to 17:20

Gil Fink and Uri Shaked

Gil FinkUri Shaked

Panel Q&A: Mobile & Progressive Web Apps

FIVE Day One at 16:05 to 16:50

Brandy Carney, Adam Bradley, Jen Looper, Jeff Cross and Alex Rickabaugh

Brandy CarneyAdam BradleyJen LooperJeff CrossAlex Rickabaugh

Why I am betting my future on Angular 2

ONE Day One at 16:55 to 17:20

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...

Shai Reznik

Shai Reznik

Watch the video  

Neural Networks and Machine Learning. Building Intelligent Angular Applications

TWO Day One at 16:55 to 17:20

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!

Carmen Popoviciu

Carmen Popoviciu

Watch the video  View the slides

Keynote

ONE Day Two at 09:10 to 09:55

Igor Minar and Rob Wormald

Igor MinarRob Wormald

Watch the video  

RxJS 5 - Thinking Reactively

ONE Day Two at 10:00 to 10:45

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"

Ben Lesh

Ben Lesh

Watch the video  

Move, shake and drop with NativeScript and Angular 2

TWO Day Two at 10:00 to 10:45

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!

Jen Looper

Jen Looper

Watch the video  

Mini Workshop: Angular Material (Part 1)

THREE Day Two at 10:00 to 11:15

Learn how Angular Material can be easily used to quickly build ES6 web applications. See how features like Layouts, Containers, and Angular 1 Material components can be combined to radically accelerate your app UX development. See how JSPM, ES6, and the Angular 1.5 component API can be used to simplify your development and bring the fun back to web app debugging.

Aaron Frost and Thomas Burleson

Aaron FrostThomas Burleson

Panel Q&A: Tooling

FIVE Day Two at 10:00 to 10:45

Jeff Whelpley, Igor Minar, Rob Wormald, Igor Kamenetsky, Stephen Fluin and Tobias Bosch

Jeff WhelpleyIgor MinarRob WormaldIgor KamenetskyStephen FluinTobias Bosch

Angular 2 Forms

ONE Day Two at 10:50 to 11:15

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.

Kara Erickson

Kara Erickson

Watch the video  View the slides

Angular Community Up & Running

TWO Day Two at 10:50 to 11:15

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.

Shmuela Jacobs and Nir Kaufman

Shmuela JacobsNir Kaufman

Watch the video  

Angular CLI

ONE Day Two at 11:45 to 12:05

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.

Stephen Fluin

Stephen Fluin

Watch the video  

From .component() to @component()

TWO Day Two at 11:45 to 12:05

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.

Todd Motto

Todd Motto

Watch the video  

Mini Workshop: Angular Material (Part 2)

THREE Day Two at 11:45 to 13:00

Learn how Angular Material can be easily used to quickly build ES6 web applications. See how features like Layouts, Containers, and Angular 1 Material components can be combined to radically accelerate your app UX development. See how JSPM, ES6, and the Angular 1.5 component API can be used to simplify your development and bring the fun back to web app debugging.

Aaron Frost and Thomas Burleson

Aaron FrostThomas Burleson

Panel Q&A: Security and Performance

FIVE Day Two at 11:45 to 12:30

Martin Probst, Dave Smith, Tim Ruffles and John Mueller

Martin ProbstDave SmithTim RufflesJohn Mueller

360 & VR Vídeo with Angular 2

TWO Day Two at 12:10 to 12:30

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!

Raul Jimenez

Raul Jimenez

Watch the video  

The Angular Router

ONE Day Two at 12:10 to 12:30

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.

Victor Savkin

Victor Savkin

Watch the video  View the slides

Look Deeply Into Your App with Augury

ONE Day Two at 12:35 to 13:00

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.

Igor Kamenetsky

Igor Kamenetsky

Watch the video  

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

TWO Day Two at 12:35 to 13:00

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.

Elizabeth Robinson, David Hunter and Dave Balderstone

Elizabeth RobinsonDavid HunterDave Balderstone

Watch the video  

Testing Angular 2

ONE Day Two at 14:05 to 14:50

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.

Julie Ralph

Julie Ralph

Watch the video  

How fast can web-apps be?

TWO Day Two at 14:05 to 14:25

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.

Tim Ruffles

Tim Ruffles

Watch the video  View the slides

Connect your Angular app to any existing backend with GraphQL

TWO Day Two at 14:30 to 14:50

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.

Uri Goldshtein

Uri Goldshtein

Watch the video  

Universal Tooling

ONE Day Two at 14:55 to 15:20

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.

Jeff Whelpley

Jeff Whelpley

Watch the video  View the slides

Testing for accessibility in Angular 1 and 2

TWO Day Two at 14:55 to 15:20

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.

Marcy Sutton

Marcy Sutton

Watch the video  View the slides

Sponsors

Many thanks to our wonderful sponsors. If you’d like to get involved in supporting AngularConnect, please request a sponsor pack.