Sessions
Tuesday, 10th Sep
Marvel Stadium, Melbourne
The conference is featuring two stages.
How Cinema, React and Styled Components are Alike?
Rodolfo Dias
ToolTime GmbH | Berlin, Germany
Google Developer Expert in Web Technologoes
Frontend Engineer at ToolTime GmbH
09:20 | Hulk Stage
Have you noticed how big is the magic behind the scenes in the cinema? The fact that the same artist can have a totally different face and behavior from one movie to another?
Now imagine all of that power in your hands. Being able to give a new face to your components and even a new behavior, based only on which application it is placed at. Wow, That's crazy, isn't it?
Let's see how to make the dreams come true using React + StyledComponents, to create a component lib able to make your apps look more stylish and give you a fun development experience.
​
Ivy Renderer for Dummies
09:20 | Iron Man Stage
What is exactly Ivy Renderer? What features will affect the way we build apps? How can we benefit for this technology? In this presentation I will cover these and other fundamental questions while demonstrating all the features available today!
​
Looking into the Vueture: Composition Functions
GitLab | Kyiv, Ukraine
VueJS Core Team
Google Developer Expert in Web Technologies
Senior Software Engineer at GitLab
10:20 | Hulk Stage
Vue 3 brings us a new feature: composition functions, a way of declaring component logic using function calls.
In this talk I will show how composition functions work and in which cases they are better than 'usual' object syntax.
​
A Deep Dive into Kendo UI
10:20 | Iron Man Stage
Kendo UI is a component library featuring native components for jQuery, Angular, React, and Vue. In this talk, I'll provide a deep dive into Kendo UI. Specifically, the many components it consists of and how they work. I'll also highlight the observations we've made about the frameworks we support.
​
We build components for developers. Kendo UI is the component library we've built for the past 8 years. We've put a great deal of blood, sweat, and tears into it. Furthermore, we've witnessed the evolution of supporting frameworks (i.e. React) and built our components to target them. We have quite a few battle scars to show for it.
Ultimately, I'd like this talk to not only highlight what we've accomplished with Kendo UI but also to share our experiences building it - especially in light of the trends we've seen with web frameworks over the past few years. We've had many debates about the direction of the product. I'd like to provide insight into our decision making. It would help the audience understand all of the nuances that go into the decision to support a framework when building components.
​
Complexity Management with NgRx
Google Developer Expert in Web Technologies
Software Engineer at Sinapse
11:10 | Hulk Stage
One of the biggest challenges building out large Angular applications is the management of complexity, but where does this complexity come from? Both state management and control flow are some of the largest contributors to unwieldy, hard-to-maintain code.
​
Learn how the design of NgRx helps you manage this complexity by exploring the architectural underpinnings of functional, reactive Angular applications.
​
Translating React
11:10 | Iron Man Stage
We often use React and write JSX without thinking about the syntax. But what’s React actually doing under the hood? What’s that JavaScript look like?
Let’s translate React into JavaScript then transpile that and see what we get. Let’s pick apart what React is really doing. We’ll get at the heart of React. We’ll talk about the importance and usefulness of knowing its baselines for beginners and experts alike.
From that, we’ll gain a clearer understanding of where React’s magic originates. So the next time you use React or write JSX, you’ll be secretly translating in your head for deeper insight and edification.
​
When Virtual DOM Diffing is a Little Too Clever
12:00 | Hulk Stage
Virtual DOMs give us an excellent developer experience but their diffing algorithms can have surprising implications. This lightning talk looks at how double announcer regions work to support screen readers and when you might use the Web Speech API instead.
Web Sharing is Web Caring
Twilio | Melbourne, Australia
Google Developer Expert in Web Technologies
Developer Evangelist in Twilio
12:00 | Iron Man Stage
Third party JavaScript, tracking scripts, iframes! What are you doing with all those share buttons on your site?
The Web Share API is here and you should know about it! It's not just a new API though, it brings benefits to your users you may not have thought of.
Let's investigate how the web platform is solving problems you didn't know you had and making sharing a more caring part of the web.
Everything I Know about React I Learned from Twitter
13:20 | Hulk Stage
React is more than a framework – it’s a collection of design decisions. But the history of those decisions is hidden from most engineers. Details behind reconciliation, lifecycles, renders, Suspense, etc. are unseen… except on Twitter.
This talk is a collection of Dan Abramov and other Core Team members’ tweets, with relevant source code, to guide attendees in deepening their understanding of React and its internals.
​
Dan recently talked about explaining the "less shiny corners" of React and I completely agree with him and the responses: this knowledge isn't Need to Know but it's Good to Know and can make you better engineer (both in JavaScript & React).
​
Data-Driven Frontend Components and the New Jira Navigation
Atlassian | Sydney, Australia
Google Developer Expert in Angular & Web Technologies
Software Engineer at Atlassian
13:20 | Iron Man Stage
In large frontend codebases, concise components are the key for the success of your application. Decisions can be done based on the user journey: better ways to improve performance by code-splitting, memory consumption, flexibility or even A/B testing. What if we can use a data-driven approach in a component level and mitigating any possible risk involved?
In this talk, I will share my experience and decisions using hypothesis and data-driven development effectively to release the new navigation in Jira, the most famous project management in the world! How to use some component patterns for A/B testing, performance and bundle size improvements and all the journey around the new navigation in Jira.
Technical SEO for JS Web Apps
14:00 | Hulk Stage
I am sick and tired of SEOs, marketing folks and developers spreading fear, uncertainty and doubt about SEO and JavaScript.
In this talk I want to give web developers a sound understanding of how Googlebot and other crawlers see your content and what are common pitfalls to avoid.
We will look into
-
How crawlers find and index your content
-
The fundamentals for React, Angular and Vue.js apps
-
Common misconceptions and mistakes and how to avoid them
-
Debugging tools and techniques to make sure people can find the things you put on the web
​
Designing with Components
14:00 | Iron Man Stage
Thanks to modern component-oriented architectures, the front-end community has been naturally gravitating towards design systems as a way of standardising our respective design languages into reusable components. When done successfully, it suddenly becomes trivial to translate standard designs into code. In fact, we may even find that this translation step starts to feel somewhat redundant.
In a world of components, how should our design processes change? How should our tooling change? How should we, as front-end developers, better enable this change? In this talk, we'll look at the current state of design and development, and where we could go— if we're willing to push for it.
Let's Build a Form Around It
Google Developer Expert in Angular & Web Technologies
Founder of HAIBRID
14:40 | Hulk Stage
Reactive Forms are a mainstay in the Angular ecosystem yet a lot of developers limit their usage to just Login pages or traditional input collection.
In this talk, I will showcase how you can take advantage of the full power of Reactive Forms to build some really powerful state-driven solutions. This talk will be based on a real-world personal experience of building complex data-driven healthcare solutions with Reactive Forms. I will also showcase some really common use cases in a lot of angular applications that may not be obvious for the application of Reactive Forms. We will explore the hierarchy of Reactive Form Controls and showcase some smart ways to implement custom validation inside of your Angular application.
The main aim of this talk is to enable users to be aware of what is at their disposal and how they can take advantage of the full power of Reactive Forms.
​
AI and JavaScript, no You're Not Dreaming
14:40 | Iron Man Stage
Like fire which was stolen from Mudhens, Artificial Intelligence has been kept away from front end developers for ages.
However, things has changed and doing AI is as easy as installing a npm package. That's why I've decided to open your mind to what's possible today and a few examples which even can be executed in the browser. You don't need to have any background in AI or Maths, just a curious mind and a willingness to try.
​
This talk was inspired by some recent projects which was shown during Google IO and the possibilities which TensorFlow.js opens up for businesses. Now that you can run machine learning even on your mobile, it is very important to show front end developers of what is possible and how to get started in under 30 mins. From converting a Keras model and use it for prediction to create a neural network from scratch, train it and use it in the browser it is all a matter of minutes only.
​
The Final Push: Deploying React Native
15:50 | Hulk Stage
React Native has opened the door for many web developers to start creating native mobile apps for the first time using the same framework they already know - React. We're able to create some amazing apps and experiences, yet inevitably, the problem of deployment comes around. How do we actually get it to the App Store? A quick search will lead you to dozens of different potential solutions, yet its tough to know what approach might work best for your app.
At Airship, we've been working with React Native for over 3 years, and over that time we've explored almost every possible way of deploying React Native apps, and gained quite a bit of experience along the way. This talk will focus on narrowing down the many options available for deploying React Native apps while weighing the pros and cons of each.
In the end, you'll have a much better idea of what React Native deployment entails, as well as what path would be best suited for your company and app.
​
Universally Speaking
15:50 | Iron Man Stage
WHHHHOOOOOSSSSHHHHHHH!!!!!! ​
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!
​
Ship Web Apps Confidently: Reliable and Developer Friendly End-to-End Testing with Cypress
16:30 | Hulk Stage
As developers, we're building the most advanced applications the web has ever seen, and we're investing more than ever in patterns, frameworks, and tools for building these apps. But building the app is only half the battle. We must also properly test our apps, and reliably ship them with a high level of confidence to ensure quality.
However, end-to-end (E2E) testing web apps in real browsers has historically been a non-trivial task. Test tool setup, writing tests, resolving failures, handling flakiness, waiting on long CI jobs, etc. consume a lot of precious time, and cause a lot of headaches. This all adds a layer friction that often leads to developers doing very little to no E2E testing.
This no longer has to be the case, as there are now modern open-source tools like Cypress, that enable fast and reliable testing of web apps in real browsers while providing a developer experience that will actually make you want to write tests.
In this session, we'll dive deep into Cypress and the associated tools, patterns, and ecosystem, so we can all ship with confidence.
​