David Khourshid: Reactive Animations with CSS Variables - JSConf Iceland 2016

CSS variables are here, and they're much more powerful than you think. In this presentation, we will explore the many possibilities with mixing RxJS with CSS variables, including how they can be used to bring your web projects to life with dynamic animations that react to user input. And yes, there will be plenty of demos.
UI animations can be an incredible asset to the user experience, especially if they are meaningful and responsive to user input. Native mobile app developers know this all too well, so how can we incorporate similar animations to the web to create an appealing user experience?
With the help of RxJS and CSS Variables, we can! In this talk, you will learn about:
What reactive animations are
How CSS Variables work
What Observables are and how they model reactive user input
How RxJS + CSS Variables can work together to create performant, reactive animations in your web apps
Recreating native mobile interactions for the web
Clever tricks and tips, and plenty of demos

[@psilocyberspaceman]

Thank someone’s god that you didn’t talk about damn React.

[@JawsoneJason]

Excellent talk! For what it's worth, CSS Custom Properties are defined with two dashes because they are browser-prefix properties with a blank browser name. Hope that helps.

[@docmars]

Great talk! I'm really excited to see what people do with these ideas to take them further. In particular, I'd be interested to see how this methodology can be applied to Vue.js with its own reactive, data-driven approach to UI development.

[@thierryskoda7806]

Great talk! I will be able to fix a lot of my problems that I had with some of my apps! Thanks a lot!

[@treenopie]

1:19 No really, that CSS/airplane seat chart joke was funny.

[@sj82516]

amazing talk and works. Thanks for inspiring content

[@nathanielbass1315]

Wow this is crazy

[@greggsworld4453]

i appreciate you! 👍

[@1da737]

It's so cooool