November 2, 2015
8:00–9:00
Doors Open
Registration
Registration
9:00–16:00
12:00–13:00 Lunch
12:00–13:00 Lunch
Workshops
React technologies
React technologies
15:30–16:30
Pre-Registration
16:30–18:00
Building apps for Silicon Valley startups
Lubo Smid —STRV
Lubo Smid —STRV
18:00–19:00
Web Development Horizons
Panel Discussion
Guillermo Rauch — LearnBoost, Automattic
Paul Taylor — Netflix
Martijn Walraven — Meteor
Richard Feldman — NoRedInk
Nikita Prokopov — Datascript
Paul Taylor — Netflix
Martijn Walraven — Meteor
Richard Feldman — NoRedInk
Nikita Prokopov — Datascript
20:00–0:00
November 3, 2015
8:00–9:00
Doors Open
Registration
Registration
9:00–9:15
Conference opening
9:15–9:45
Abstracting Just Enough
James Long —Mozilla
James Long —Mozilla
Abstracting Just Enough
The frontend landscape changes at a relentless pace. New ideas seem to appear every month. How can you possibly keep up? I'm on the Firefox Developer Tools team, and we are starting to move towards React and Redux for our frontend. I will explain these choices, the reasons behind them, and how we're migrating old code. Our minds can only keep up with a certain level of abstraction, and it's important to choose abstractions that solve fundamental problems rather than shallow ones. The right abstractions will make an order of magnitude difference in power and simplicity, and the wrong ones can be deadly. It's important to estimate the cost of every abstraction, and be ruthless about keeping it as simple as possible.
9:45–10:45
Bind to the Cloud with Falcor
Paul Taylor —Netflix
Paul Taylor —Netflix
Bind to the Cloud with Falcor
Imagine how easy building your web application would be if all of your data was available in-memory on the client. Falcor lets you to code that way.
Falcor is the open-source, JS data access framework that powers Netflix. Falcor lets you represent all of your cloud data sources as one virtual JSON model on the server. On the client, Falcor makes it appear as if the entire JSON model is available locally and allows you to access data the same way you would from an in-memory JSON object. Falcor retrieves the model data you request from the cloud on-demand, transparently handling all the network communication and keeping the server and client in sync.
Falcor is not a replacement for your MVC framework, your database, or your application server. Falcor fits seamlessly into your existing stack and lets the layers communicate more efficiently.
Get an inside look at the innovative data platform that powers the Netflix UIs and the new UI design patterns it enables. Learn more how Falcor powers Netflix, and how you can integrate into your existing stack.
Falcor is the open-source, JS data access framework that powers Netflix. Falcor lets you represent all of your cloud data sources as one virtual JSON model on the server. On the client, Falcor makes it appear as if the entire JSON model is available locally and allows you to access data the same way you would from an in-memory JSON object. Falcor retrieves the model data you request from the cloud on-demand, transparently handling all the network communication and keeping the server and client in sync.
Falcor is not a replacement for your MVC framework, your database, or your application server. Falcor fits seamlessly into your existing stack and lets the layers communicate more efficiently.
Get an inside look at the innovative data platform that powers the Netflix UIs and the new UI design patterns it enables. Learn more how Falcor powers Netflix, and how you can integrate into your existing stack.
10:45–11:15
Coffee Break
11:15–11:45
Functional Programming in JavaScript. What, why, and how.
Daniel Steigerwald —VacuumLabs
Daniel Steigerwald —VacuumLabs
Functional Programming in JavaScript.
As programs get bigger, they also become more complex and harder to understand. We all think ourselves pretty clever, of course, but we are mere human beings, and even a moderate amount of chaos tends to baffle us. And then it all goes downhill. Working on something you do not really understand is a bit like cutting random wires on those time-activated bombs they always have in movies. If you are lucky, you might get the right one ― especially if you are the hero of the movie and strike a suitably dramatic pose ― but there is always the possibility of blowing everything up.
11:45–12:30
How immutability, functional programming, databases and reactivity change front-end
Nikita Prokopov —Datascript
Nikita Prokopov —Datascript
How immutability, functional programming, databases and reactivity change front-end
Even though I believe programming UI can be made simple, right now, front-end is hard. We’re at the very beginning of our path to the future web: simple, error-prone, pleasant to use. In this talk, we’ll see how practices we have today in back-end programming, such as immutability, use of database engines, query languages and functional programming, can help us build JavaScript UIs. Examples include DataScript, Elm, Om, ClojureScript, Relay and more
12:30–13:15
The Case for CSS Modules
Mark Dalgleish —SEEK
Mark Dalgleish —SEEK
The Case for CSS Modules
With the push towards writing CSS in JavaScript within the React community, CSS Modules have suddenly emerged as a surprisingly popular alternative that still allow us to maintain our connection with the CSS community. Do we have to give up writing CSS in JavaScript? Are we clinging to the past, or do CSS Modules offer a new way forward for the entire web community? In this talk we'll examine both the history and potential future of CSS Modules, and hopefully inspire the next generation of styling in React.
13:15–14:15
Lunch Break
14:15–14:45
Victory.js - A Powerful Data Visualization Library for ReactJS
Colin Megill —Formidable Labs
Colin Megill —Formidable Labs
We tried swapped out D3's DOM model in favor of React. The result? Love at first iteration. Building a data visualization library as React components means that you can reclaim your SVG as declarative markup, NPM install visualizations directly into your project (can't do that with bl.ocks!), fork them, remix them and file issues against them. It also meant completely rethinking how animations are done, since D3's animation model relies on its DOM model. Come learn the API, and what it means for the future of interactive data visualization.
14:45–15:15
State, UI and the stuff in between
Christian Alfoni
Christian Alfoni
State, UI and the stuff in between
The one way flow of flux has pushed us in the right direction, but we are still evolving what makes up that flow. Cerebral is a project that separates storing state and producing state with a functional flow defining API called signals.
15:15–15:45
Front‐end Can Be More Functional
Julia Gao
Julia Gao
Front-end Can Be More Functional
Functional programming gives developers better ideas on how the application will react, more expected outputs, and less time needed for debugging. Immutability is one of the key points for functional programming, I'll show you some of the things we can improve on the front-end to make the code more immutable and functional.
15:45–16:15
What do reactive apps react to?
Victor Grishchenko —Swarm.js
Victor Grishchenko —Swarm.js
What do reactive apps react to?
"Let's zoom out of the reactive front-end story to see the big picture. How data and events propagate between clients and servers? What if clients are mobile and connections are intermittent?
What about offline work? Can we cache our data? What if we need to act in real time?
Welcome to the world of distributed mutable state, also known as ""hell"". Way too often, existing methods pretend that we act in a single point, at a single moment of time, alone (think ACID).
One approach to truly asynchronous thinking is the math apparatus known as CRDT (Commutative/Convergent Replicated Data Types). I will tell how CRDT can be practically used to resolve some of the challenges mentioned."
What about offline work? Can we cache our data? What if we need to act in real time?
Welcome to the world of distributed mutable state, also known as ""hell"". Way too often, existing methods pretend that we act in a single point, at a single moment of time, alone (think ACID).
One approach to truly asynchronous thinking is the math apparatus known as CRDT (Commutative/Convergent Replicated Data Types). I will tell how CRDT can be practically used to resolve some of the challenges mentioned."
16:15–16:45
RxJS Evolved
Paul Taylor —Netflix
Paul Taylor —Netflix
RxJS Evolved
Reactive Extensions for JavaScript is evolving! Building on lessons learned from RxJava and RxMobile, Microsoft Netflix, Google, and the ReactiveX community have begun work on the next version of RxJS. This talk will enumerate the improvements we’ve made to increase speed, reduce memory, expose locations for extension, provide more debuggable call-stacks, and enable more readable flame charts.
16:45–17:15
Coffee Break
17:15–17:45
Universal React + Flux at scale
Rajiv Tirumalareddy —Yahoo
Rajiv Tirumalareddy —Yahoo
Universal React + Flux at scale
React is great and Flux is awesome. Running both on the server and client is even better! You've built your app with the latest and greatest tech stack, but will your app scale to millions of users? We created and open sourced Fluxible and other libraries that support Yahoo's high-traffic web applications. I'll share our learnings and go through best practices, performance concerns, and challenges of building robust and scalable web applications.
17:45–18:30
Integrating React with Reactive databases
Tomas Kulich —VacuumLabs
Tomas Kulich —VacuumLabs
Integrating React with Reactive databases
React is a great tool for synchronizing data with views on the client side. However, to achieve perfect real-time experience one also needs to synchronize server data with client data. Unfortunately the nowadays widely used REST-like API is rather suited to one-time fetches, usually resulting in stale client data. Reactive databases such as Firebase seek to be the solution to this problem.
I will show how Firebase can be integrated with React (spoiler alert: it can be done in a beautiful way) to get what-you-see-is-what-it-really-is kind of UX and how the FLUX pattern helps us to keep database updates clean. Since Firebase-like databases are quite fresh and immature, you may get an inspiration for a nice Friday-night project here.
I will show how Firebase can be integrated with React (spoiler alert: it can be done in a beautiful way) to get what-you-see-is-what-it-really-is kind of UX and how the FLUX pattern helps us to keep database updates clean. Since Firebase-like databases are quite fresh and immature, you may get an inspiration for a nice Friday-night project here.
18:30–19:30
Lightning Talks
Get to know speakers!
Get to know speakers!
19:30
Door Closing
20:00–0:00
Partners Cocktail Dinner @ Restaurant Hradná Hviezda
Námestie Alexandra Dubčeka 4809/1. By Invitation only
Námestie Alexandra Dubčeka 4809/1. By Invitation only
November 4, 2015
8:15–8:45
Doors Open
8:45–9:15
React, transparent reactive programming and mutable data structures
Michel Weststrate —Mendix
Michel Weststrate —Mendix
React, transparent reactive programming and mutable data structures
The ability to express essential complexity in a simple way is crucial for any code-base. At Mendix we did an interesting discovery during the development of a complex MDD tool. React, mutable data structures and transparent reactive programming are a match made in heaven. We published a library that leverages these concepts; Mobservable. It helps you to write simple, declarative, yet highly efficient code. Your future code maintainers will love you for applying it.
9:15–9:45
Let’s talk Javascript
Mike Grabowski —Man+Moon
Mike Grabowski —Man+Moon
Let’s talk Javascript
"The web is evolving out of the browser. With the rise of React Native for iOS, and the recently open sourced Android version, universal javascript is now about fully featured experiences across web, mobile devices and soon, it will be also about smart watches, TVs and beyond.
Device fragmentation is about to explode and the need for write-once and run-everywhere is stronger than ever. The ability to maintain a single codebase of components and logic is currently a convenience but soon will be a necessity to keep up with the plethora of devices that our services will be accessed through.
This talk explores these concepts and discusses the foundations of a developing a device-agnostic platform. By checking out various patterns and deployment techniques we are going to see how you can power all your devices by Javascript with confidence. Yes, even your washing machine!"
Device fragmentation is about to explode and the need for write-once and run-everywhere is stronger than ever. The ability to maintain a single codebase of components and logic is currently a convenience but soon will be a necessity to keep up with the plethora of devices that our services will be accessed through.
This talk explores these concepts and discusses the foundations of a developing a device-agnostic platform. By checking out various patterns and deployment techniques we are going to see how you can power all your devices by Javascript with confidence. Yes, even your washing machine!"
9:45–10:30
Instant Text
Guillermo Rauch —LearnBoost, Automattic
Guillermo Rauch —LearnBoost, Automattic
Instant Text
The traditional chat application hasn't changed much in the past three decades. The speed at which we communicate can be greatly enhanced by rethinking some fundamental paradigms. This talk will explore the evolution of instant messaging, and how the React model enables its ultimate realization.
10:30–11:00
Coffee Break
11:00–11:30
d3 with React
Andreas Savvides —Twitter
Andreas Savvides —Twitter
d3 with React
d3 has been the de facto standard when it comes to data visualisations for a while now and React has recently emerged as the go-to library for building user interfaces. d3 and React are both data-centric libraries, making them a natural fit; d3 takes a data-driven approach and React aims to solve the problem of data changing over time in the context of building large applications.
There have been various approaches documented on how to effectively use d3 and React together. In this talk, I will be going through a number of these approaches, talking about what I have learned from them and how I go about creating reusable chart components for large scale applications.
There have been various approaches documented on how to effectively use d3 and React together. In this talk, I will be going through a number of these approaches, talking about what I have learned from them and how I go about creating reusable chart components for large scale applications.
11:30–12:00
Work and Play in the React Native Playground
Joshua Sierles —independent
Joshua Sierles —independent
Work and Play in the React Native Playground
If you’re like me, coming from web development, you find traditional mobile development slow and difficult to learn hands-on without a lot of guesswork, headaches and patience. Above all, things just move slower.
The React Native Playground breaks down barriers to mobile development by making it speedy and trivial to write and test React Native code across platforms and devices. I want to share my experience working with an amazing team on this free resource.
First, I'll give a quick tour of what's possible with the Playground, showing off some of React Native itself.
We’ll see how React Native’s unique architecture made this project possible, revealing some interesting details of its inner workings. For example, how we're serving React Native javascript code over the web, and how we can load an application from inside another one.
Finally, I want to briefly discuss how working on project like this, which help developers learn faster, can be fun, rewarding and an antidote to programmer fatigue.
The React Native Playground breaks down barriers to mobile development by making it speedy and trivial to write and test React Native code across platforms and devices. I want to share my experience working with an amazing team on this free resource.
First, I'll give a quick tour of what's possible with the Playground, showing off some of React Native itself.
We’ll see how React Native’s unique architecture made this project possible, revealing some interesting details of its inner workings. For example, how we're serving React Native javascript code over the web, and how we can load an application from inside another one.
Finally, I want to briefly discuss how working on project like this, which help developers learn faster, can be fun, rewarding and an antidote to programmer fatigue.
12:00–13:00
Effects as Data
Richard Feldman —NoRedInk
Richard Feldman —NoRedInk
Effects as Data
Imagine a world without side effects, where the only way to make things happen was to call functions whose return values described what you wanted done. What gets easier in that world? What gets harder? What would that mean for debugging? Testing?
We don't have to wonder about these things, because this world already exists — and it compiles to JavaScript. It's the world of Elm, where there are no side effects, all functions are stateless, and all data is immutable. Elm embraces the concepts that make reactive programming great, and goes one step further to shed the error‐prone mutations and side effects that so often lead to incidental complexity and buggy code.
NoRedInk has reaped the benefits of this approach since they began using Elm in production earlier in 2015. It's helped them scale and maintain a complex front-end code base that students use to answer millions of questions per day. Come see how refreshing this world can be!
We don't have to wonder about these things, because this world already exists — and it compiles to JavaScript. It's the world of Elm, where there are no side effects, all functions are stateless, and all data is immutable. Elm embraces the concepts that make reactive programming great, and goes one step further to shed the error‐prone mutations and side effects that so often lead to incidental complexity and buggy code.
NoRedInk has reaped the benefits of this approach since they began using Elm in production earlier in 2015. It's helped them scale and maintain a complex front-end code base that students use to answer millions of questions per day. Come see how refreshing this world can be!
13:00–14:00
Lunch Break
14:00–14:30
Going Reactive with React.
François de Campredon —Fadio IT
François de Campredon —Fadio IT
Going Reactive with React.
In the past two years, React and all the related projects completely changed our way of creating application by breaking all the rules and forcing us to redefine what we thought being "best practice". However, there is still an area that has not changed much : how we define the relationship between user input and application state. In this talk, I'll try to demonstrate that we can express this relationship in a simpler and more declarative way by using techniques from reactive programing and by combining React with RxJS.
14:30–15:00
Form validation made simple with React
Marcela Hrda —VacuumLabs
Marcela Hrda —VacuumLabs
Form validation made simple with React
Creating validated forms is usually a troublesome experience. Most libraries used for building forms are complex and difficult to customize. As React plays nicely with functional approach, it can be easily used to create library for creating forms that is: a) simple and easy to understand b) customizable and extensible c) providing top user experience. I will present such library for building validated forms.
15:00–15:45
From React web to native mobile: mapping out the unknown unknowns
Brent Vatne —Independent
Brent Vatne —Independent
From React web to native mobile: mapping out the unknown unknowns
Engineers with experience using React for web coming who dive into mobile will feel at home quickly because the basic React API doesn't change. But building for mobile introduces a different way of thinking about the software that you create and React Native empowers you to embrace this rather than attempt to hide it from you: your primary mode of interaction is touch, animations are more common and are expected to be smooth and dynamically track your gestures, you actually have to think about how your app will handle offline / poor connectivity, what happens when the user backgrounds it and comes back, how to send push/local notifications and respond to them, how to stay at 60fps performance on a much less capable device with more demanding users, responding to the keyboard appearing and hiding - specifying different keyboard types, autocorrect/autocomplete, dealing with device orientation changes and status bar changes, app store deployment delays and more. I won't go into great detail about each of these points but will rather help you to build a mental map of the space and touch on solutions that React Native provides to handle these mobile-specific problems, in order for unknown unknowns can become known unknowns. So this talk is kind of to React Native what a maphack is to Starcraft, but totally not lame like that.
15:45–16:15
Under the hood of React Native
Martin Koníček —Facebook
Martin Koníček —Facebook
Under the hood of React Native
Learn how Facebook uses React Native and how we run the open source project.
16:15–16:45
Coffee Break
16:45–17:15
Dato — a functional way to build reactive applications
Sean Grove —Bushido
Sean Grove —Bushido
Dato — a functional way to build reactive applications
Dato is a new way of building applications, heavily inspired by Meteor/Firebase/Relay, but informed by functional, data-oriented programming techniques.
The goal is to provide:
The goal is to provide:
- Seamless, permission-aware data synching between the sever and n-clients
- Seamless, permission-aware rpc invocations
- A more flexible, intuitive UI layer
- Advanced tooling layer for time-traveling debuggers, state serialization, component layout, query editing, performance optimizations, and others.
- Integration on the backend to stream into analytics, session replay, 3rd-party integration
17:15–18:00
Cycle.js and functional reactive user interfaces
Andre Staltz —Futurice
Andre Staltz —Futurice
Cycle.js and functional reactive user interfaces
React's future is going to be more functional, and less OOP. What if that future is already reality? How would it look like? React's foundations are reactive rendering and UI as a pure function of state. These two foundations are reactive programming and functional programming, yet React has a lot of concepts from imperative programming. In this talk we will discover how Cycle.js is purely reactive and functional, and why it's an interesting alternative to React.
18:00–18:30
View systems in Atom: Past, Present and Future
Daniel Hengeveld —Github
Daniel Hengeveld —Github
View systems in Atom: Past, Present and Future
This talk covers the evolution of Atom's view system, from its humble beginnings through the transition to React and then away from it again, and the landscape of possibilities for the future of Atom, or any large Javascript app targeting today's web platform.
18:30–19:00
Closing ceremony
19:00
Door Closing
20:00–0:00
Reactive Afterparty @ KC Dunaj, Nedbalova 3, Bratislava
Sponsored by VacuumLabs. See Directions in PDF
Sponsored by VacuumLabs. See Directions in PDF
