ReactEurope is back on 18-19 May 2017 to bring you the best and most passionate people from the very core team to the coolest people from the community we love. 

The conference aims to give talks that inspire and explore new futuristic ideas dealing with all the techs we enjoy from the React ecosystem such as React.js, React Native, GraphQL, Relay, Universal apps, Webpack, inline CSS and more.

ReactEurope is also a great occasion to socialize, meet new people and old friends, hack together, taste delicious food and have fun in the beautiful city of Paris.

Join us at ReactEurope Conf to shape the future of client-side, mobile and universal applications!

ReactEurope

Keynote

Dominic tals about what makes inferno’s so fast and how he and the team are bringing this experience to react.

What I Learned Benchmarking React

Jest was adopted widely across 100s of companies recently and provides an immersive testing experience. We’ll take a deeper look at JavaScript Testing with Jest and what it takes to turn a tool into a product with a delightful experience.

Building High-Quality JavaScript Tools

The new wave of frameworks won’t be frameworks at all.
In this talk, Sunil will explore how compilers and bundlers will replace certain runtime dependencies, without degrading the development experience that we all love and depend on. We’ll discover strategies of incorporating these ideas into any regular app, how we can leverage component models from react/vue/ember etc to enhance these ideas, and my own take on tooling in this framework-less world.

La nouvelle vague

Worse is Better: The Upside of JavaScript Fatigue

There’s a big push to improve React’s perceived performance. And WebAssembly is fast. Could WebAssembly be part of the solution? In this talk, code cartoonist Lin Clark will look at what WebAssembly could mean for React’s performance, and how the new Fiber architecture makes that even more of a possibility.

What WebAssembly means for React

Imperfection

Practical Confidence: Using Types to Help Your Computer Help You

If only React Native apps could be highly extensible- such that a single experience within an app could be published and installed into other apps. If your screens are built with sufficient isolation, they can be portable between apps, platforms, and navigation implementations. In this talk, we will discuss how this ultimate modularity can be achieved simply by utilizing reducers and single-directional data flow. Then we will use React Navigation to quickly build a new experience with these techniques, and see how portable it really is.

Maximally Modular Apps with React Navigation

React’s server-side rendering speeds up page load times, but it’s far from the only performance boost we can get on the server. In this talk, I’ll discuss how exploiting streaming and parallel processing on the server and browser can get us faster time to first byte, faster time to first paint, and faster time to full interactivity.

How Streaming Can Supercharge React

The Rise of Low Configuration Tooling

Detox — Graybox End-to-End Tests and Automation Library for React Native

Serious graphics on React Native

Expo Snack

return null;

Thousand ways to navigate in React Native

Devtools for GraphQL

Creating apps from scratch is stupid!

Leveraging code-splitting in React

Smarter code-splitting & preloading for React apps

Quantifying Best Practices

How to create a React Native reusable component for existing Android apps without knowing a thing about npm or node_modules

Last years there have been great developments in state management libraries. Both Redux and MobX sprung from the React community and provide stand-alone, generic state management solutions. Both have gained big in popularity, and both have their own strengths and weaknesses. What can we learn from both approaches? Can we get the best of both worlds? Can we add a little Boabab and Cerebral to the mix? Is it possible to create a transparent reactive, snapshotable state container. With support for JSON patches, replayable actions, serialization, complex object graphs. With Redux & MobX compatibility, strong typing and runtime type checks out of the box. Get a glimpse of what next-gen state management might look like with mobx-state-tree. Largely designed by the MobX community and enforcing many best practices that have evolved over the last year.

Next generation state management

Composition

Twitter Lite is a complex PWA built with Node.js, React, Redux, Service Workers, and Webpack. This talk will cover how our team designs and builds one of the world’s most visited web apps. You’ll also hear about React Native for Web; how we approach network and render performance challenges; and how we use new web platform features.

The making of Twitter Lite

Authoring VR content is time consuming and technically challenging, I’ll be providing an overview of how we are using the core strengths, merits of React Native and building on it to drive and improve app development within Oculus. I’ll go into more detail about the runtimes of both the native Android version and WebVR versions and how we utilize the improved engineer workflow the technology gives us access to.

The runtimes of React VR and use at Oculus

With the advent of libraries like React, Redux and Immutable.js, it’s clear that there’s a shift away from imperative and object-oriented in the front-end towards a more declarative and functional approach. Meanwhile, libraries like RxJS and Mobx are spreading the use of Reactive Programming to model UIs via discrete, asynchronous event streams. How can we combine the best of both functional and reactive paradigms to model and build predictable UIs that control themselves?
In this talk, Preethi will explain what “Functional Reactive Programming” is, how close React / Redux / Mobx / RxJs and others come in realizing Functional Reactive Programming, and what’s still fundamentally missing from these tools to achieve a true implementation of FRP. Lastly, she’ll describe when and why FRP is suitable (or not suitable) for building predictable and scalable UIs.

Functional && Reactive

Relay Modern

React provides an abstraction between the description of a UI and the details of how it’s rendered on a given platform. The problem is that div and span are a hidden dependency on react-dom, and similarly, React Native’s View is an explicit dependency on Native, making both not quite as “cross-platform” as we want them to be. Learn how we as a community can get around these issues, and what we can unlock by doing so.

React as a Platform: A path towards a truly cross-platform UI

We are biologically trained to notice motion: evolutionarily speaking, our survival depends on it. For this reason, animation when done well can guide your users. It can aid and reinforce spatial maps of our interfaces, and give us a sense that we understand interactions more deeply. For this reason, animation is incredibly powerful to convey meaning, but only when done well.
But animating the virtual DOM comes with some intricacies that affect our implementations. In this talk, we’ll go over animating in React with a variety of methods, comparing and contrasting each. We’ll cover add-ons like ReactCSSTransitionGroup, using external libraries like GSAP, React-Motion, motion using RxJS, and transitioning state with D3. We’ll look inside some real systems, breaking down how we can create reusable components of animation principles for interchangeable yet cohesive patterns.

Animating the Virtual DOM

Animations can make your app more pleasing to use and help the user understand state changes. This talk will give best practices on when to use them and an introduction of how to implement them in React Native with a deep dive into a new strictly declarative approach similar to CSS animations and transitions.

A Novel Approach to Declarative Animations in React Native

With React, Redux, ImmutableJS and friends, frontend development strive towards the functional approach proving to yield increased readability and maintainability. However, working in JavaScript, we never truly commit to the paradigm, but what if we did? The Elm language goes fully functional and as suspected, it comes with an ocean of benefits!

Putting the fun in functional with Elm

This talk will go over our approach of incremental React Native adoption within an already established native app. We will discuss the various problems that arise from using React Native in such a “hybrid” app model and in particular, discuss inter-app navigation and embedding React Native views into native shells and vice-versa.

Integrating React Native with Native Infrastructure

Each video has a comment with the code snippets being used. To get started, you just need to install "yarn add global create-react-native-app" and generate your first app. You can also find more info here https://reacteu.xyz/

React Native Workshop - Getting started

Q&A Panel

code posted at 55:22 https://gist.github.com/patcito/b76e4a1fe2549ef2c750c4ba6cb28d80

Each video has a comment with the code snippets being used. To get started, you just need to install "yarn add global create-react-native-app" and generate your first app. You can also find more info here https://reacteu.xyz/

ReactEurope 2017

May 18 - May 19 | Paris, France