The differences between ElementRef, TemplateRef, ViewContainerRef

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.


        Ashnita Bali

Ashnita Bali

Web Frontend Developer


        Marcin Ryzycki

Marcin Ryzycki

Software Engineer


The theory of Angular Ivy

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.


        Alex Rickabaugh

Alex Rickabaugh

Software Engineer - Angular - Google


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

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!


        Ana Cidre

Ana Cidre

Developer Advocate & Engineer - Ultimate Angular


        Sherry List

Sherry List

Front-end Lead Developer - Nordea Bank


How to AI in JS?

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.


        Asim Hussain

Asim Hussain

Cloud Developer Advocate - Microsoft


Talk details coming soon


        Aysegul Yonet

Aysegul Yonet

Senior Angular Engineer - Narwhal Technologies


Nest the backend for your Angular application

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?


        Bo Vandersteene

Bo Vandersteene

Freelance Software Engineer


Talk details coming soon


        Christian Liebel

Christian Liebel

Consultant - Thinktecture


Talk details coming soon


        Christian Weyer

Christian Weyer

CTO - Thinktecture


Universally speaking

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!


        Craig Spence

Craig Spence

Tech Lead - Trade Me


How Angular put the mega into megabus.com

In January 2017 Megabus embarked on a complete rebuild of their website. Six months later it launched. In this talk, I'll explain how Megabus used Angular to add zing to their website. How they used Angular to build fast, attractive, engaging components and how they integrated those components into their CMS. Angular made it possible to deliver high-quality code in less time and with fewer bugs. But integrating Angular into a real-world multi-discipline IT department was challenging.

By the end of this talk you will understand both the technical and non-technical issues, the solutions and the compromises. I'll even talk a little bit about what we've got planned for the future.


        Darryl Brown

Darryl Brown

Angular Consultant


Upgrading to Angular without ngUpgrade

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.


        Erin Coughlan

Erin Coughlan

Software Engineer - Google


Getting to grips with Angular State with NgRx and RxJS

One of the reasons for the success of React is down to the popular architecture style Redux. With the "Reactive Extensions for Angular" (NgRx), Redux has finally arrived on the Angular scene. Complex applications are becoming more easily controllable and components can be strictly separated from domain/business logic.

In this session, Angular book authors Ferdinand Malcher and Johannes Hoppe will introduce you to all the building blocks of Redux. They will show you how Redux and RxJS work using specific examples of NgRx. With the help of clear examples, you will learn how to apply the most important components and patterns. By the end of the session, you will be able to understand terms such as Observables, Immutability, Actions and Reducers as well as Effects. Thanks to the demo materials that are provided, you will be able to create your own Angular application with RxJS and NgRx.


        Ferdinand Malcher

Ferdinand Malcher

Co-founder - Angular.Schule


        Johannes Hoppe

Johannes Hoppe


#UseThePlatform with Stencil and Angular

Web development changed dramatically during the last years. With the enormous amount of JavaScript libraries and the HTML5 standard, today it is much easier to create web apps. When building a web app, you will probably want to reuse some of the web components you built. But how can you do that with the current state of HTML?

One of the new and emerging web standards is Web Components. The Web Components standard enables you to create reusable web components that include HTML, CSS and JavaScript. On the other hand, crafting raw components can be cumbersome. This is were Stencil comes into place.

In this mini workshop you will get familiar with Stencil, a compiler that generates standard-compliant Web Components. Then, you will create an Angular app that uses Stencil generated components to show you how to combine both Stencil and Angular in your app development.


        Gil Fink

Gil Fink

CEO - sparXys


Automate G Suite with Apps Script and Angular

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.


        Grant Timmerman

Grant Timmerman

Engineer - G Suite


Schematics from top to bottom

Schematics makes it easy to create reusable and extendable workflows, such as creating a new component or refactoring a library. This talk will take a look at Schematics to help you get started, and dive deep to give you a good understanding of the different concepts and tools involved.


        Hans Larsen

Hans Larsen

Senior Software Engineer - Google


Talk details coming soon


        Igor Minar

Igor Minar

Angular Team Lead


Angular Ivy by example

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.


        Jason Aden

Jason Aden

Software Engineer - Angular - Google


Testing Angular with Cypress.io

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.


        Joe Eames

Joe Eames

Google Developer Expert


VS Code Can Do That

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!


        John Papa

John Papa

Principal Developer Advocate - Microsoft


Dynamic reactive forms with GraphQL

One of the most challenging requirements when building enterprise web applications for financial services is capturing large amount of information through user input, this information is normally typed in large forms that contain dozen to hundreds of fields with complex validation logic and multiple dependency 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.


        Juan Stoppa

Juan Stoppa

Software Engineer - Wealth Dynamix


Testing At Scale

How do we test a large, distributed Angular project? Julie will talk about strategies and tools we use to maintain quality and developer productivity on one of Google's largest Angular apps.


        Julie	Ralph

Julie Ralph

Senior Software Engineer - Google


Angular Material workshop

Learn how to build good-looking, performant, scalable and accessible apps using the stable release of Angular Material, Angular Flex layout and the Angular CDK. In this workshop, we'll build a production-ready app from scratch that is lightning fast, uses the latest features, supports server-side rendering and is accessible to people with disabilities.


        Kristiyan Kostadinov

Kristiyan Kostadinov

Software Engineer


        Paul	Gschwendtner

Paul Gschwendtner

Software Engineer - Angular Material


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

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.


        Manfred Steyer

Manfred Steyer


The life of an Angular pull request

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.


        Manu Murthy

Manu Murthy

Technical Program Manager - Angular - Google


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

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.


        Martin Probst

Martin Probst

Software Engineer - Google


Optimize and debug change detection like a pro

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.


        Max Koretskyi

Max Koretskyi

Developer Advocate - ag-Grid


Building an Angular PWA: Angular Service Worker or Workbox?

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.


        Maxim Salnikov

Maxim Salnikov

Full-Stack Developer - ForgeRock


RxJS schedulers in depth

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.


        Michael Hladky

Michael Hladky

Dev/Consultant/Trainer - GDE


You Might Not Need NgRx

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.


        Michael Ryan

Michael Ryan

Software Engineer - Synapse


Deep dive into Angular CLI @next

This year, Angular CLI have known a lot of changes. Angular/devkit, with schematics and build architects, brought adaptability and extensibility. Ng-packagr (now integrated thanks to the devkit) brought libraries support. With that came a lot of underlying tools upgrades, the main one being Webpack. But what does @next bring? What issues still needed to be solved after version 6, and how have they been (/ will they) so?

Let Noël bring you with him into a journey to Angular CLI core and top features comprehensions, and you will finally be able to really use the CLI at his full power!


        Noël	Macé

Noël Macé

Developer Advocate - SFEIR


Runtime i18n with Ivy

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.


        Olivier Combe

Olivier Combe

Angular Core Team


Talk details coming soon


        Rob	Wormald

Rob Wormald

Angular Developer Programs Engineer - Google


How to save time & money by planning your ngUpgrade

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.


        Sam Julien

Sam Julien

Creator - UpgradingAngularJS.com


Talk details coming soon


        Sani Yusuf

Sani Yusuf

Founder - HAIBRID


Angular Unit Testing - how to win friends, design better code, and get rich quick!

"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. But getting started with testing is hard, and testing Angular apps can be confusing and overwhelming. In this talk, I'll share with you a few secrets that will jump-start your way to 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.


        Shai	Reznik

Shai Reznik

Founder - HiRez.io


It’s alive! Dynamic components in Angular

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.


        Shmuela Jacobs

Shmuela Jacobs

Developer and Consultant, Founder of ngGirls


From web to mobile with NativeScript and Angular

NativeScript opens up a whole new world for the Angular developers - a world where you can use your web skills to build truly native mobile apps that run both on Android and iOS.

But we can go even further - what if I told you can extend your existing web application with a shiny mobile app? It is true - Angular's platform agnostic nature allows you to reuse your business logic across multiple platforms.

Come and see it for yourself! Together we'll transform an Angular website to a multi-platform application running on web, Android and iOS.


        Stanimira	Vlaeva

Stanimira Vlaeva

Software Engineer - Progress


Talk details coming soon


        Steffen Jahr

Steffen Jahr

Software Developer - Thinktecture AG


Automating UI development

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.


        Stefan Baumgartner

Stefan Baumgartner


        Katrin Freihofner

Katrin Freihofner

Design Operations Engineer


Climbing up injector trees

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? 💉🌲


        Uri Shaked

Uri Shaked

Consultant - BlackBerry


        Kapunahele Wong

Kapunahele Wong

Software Engineer - Tipe.io


White-labeling & A/B testing with interchangeable components

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


        Younes Jaaidi

Younes Jaaidi

Sponsors

Interested in sponsoring? Please get in touch with Daisy Wort, Sponsorship Manager, to request a sponsor pack.

Rangle

Premier Sponsor

Progress

Platinum sponsor

Infragistics

Platinum sponsor

ag-Grid

Platinum sponsor

BrieBug

Platinum sponsor

Oasis Digital

Gold sponsor

Twilio

Gold sponsor

Ryanair

Gold sponsor

Ionic

Gold sponsor

U2U

Silver sponsor

Google Developers

Community sponsor

Sticker Mule

Bronze sponsor

Balsamiq

Bronze sponsor

Join our mailing list

Sign up to receive updates about AngularConnect, including speaker previews, ticket launches, Call for Proposal details and other exclusive content. We won’t spam you and will only send you emails we genuinely think you’ll find interesting. You can unsubscribe at any time and you can find more information in our Data Promise.