First community conference in Europe, focused exclusively on React Native. Community, core contributors, insights, networking and tons of knowledge - that's all waiting for you in one of the most beautiful cities in Central Europe, Wroclaw.

React Native EU

INTRO

Look at the Core

The "Transitioner" is the view in React Navigation responsible for animating between screens and supporting navigation gestures. We will discuss how views like "stack" work today, how they evolved, and how they fit into React Navigation and other navigation libraries. Historically, it has been quite difficult to create custom screen transitions and gestures. So the time has come to introduce a new Transitioner, and give you complete control over screen transitions in your React Native App.

Owning Transitions

Why GraphQL will become the new standard for accessing external data in your React Native app. I will show how using GraphQL instead of REST services the development process becomes even more declarative as GraphQL will take away the (imperative) hassle of tying data from multiple endpoints together. This will increase the level of complexity in React Native development, while also increasing the performance of the application.

Slides: https://www.slideshare.net/RoyDerks1/graphql-will-do-to-rest-what-json-did-to-xml-113763718

GraphQL Will Do To REST What JSON Did To XML

Let's take a look at look at what we can do with React Apollo today, how we can use it to even manage our local state and see what the future holds for us in the new releases of React Apollo.

GQL all the Things!

For the past 2.5 years I've been working on a bunch of projects, all aiming to expose some native capabilities to be controlled from JavaScript in React Native app. Most notable ones were: native driver support for Animated and two libraries: React Native Gesture Handler and Reanimated. All these projects were inspired by needs of navigation libraries and were meant to fill the gap between platform native navigation solutions and ones that are available in React Native.

Our React Native projects often starts by deciding whether to go with native navigation (react-native-navigation) or JS navigation library (react-navigation). But given all these improvements can we still call react-navigation "not native"? In this talk we will learn how Gesture Handler and Reanimated libraries came to live with navigation being the driving force. In this context I will discuss how far is react-navigation from finally proclaiming the badge of really native navigation library.

Slides: https://speakerdeck.com/kmagiera/it-all-starts-with-navigation

It all starts with navigation

When building a website, you expose an endpoint where you control the contents that are served back to a user. What if you could do this with a mobile app? Quin will be talking about how you can host your own javascript bundles, writing your own policies so you control exactly what version of the app different users get, and pushing them over the air to users for real time updates.

Self hosting mobile applications

So you want to buy a painting, but not sure which one. Or where to place it? we have a solution. Just use your phone for this. Augmented reality becomes more popular in recent years. Companies like Apple or Google invests tons of money to develop AR support. Smartphones became powerful enough to deal with all these new features. And it'll be ridiculous not to use all this power when looking for the best place to put a piece of art. In this talk we'll be looking at ARKit from Apple and the ways how we can use it with React Native. We'll be building a simple app to hang paintings on the wall and learning how to deal with newest AR technologies.

How to hang a painting on the wall with React Native

How do you manage user data in your React Native app? A popular approach is to use Redux or MobX with a persistence adapter. This works great for small, simple apps, but it has a serious flaw: it doesn't scale very well. Introducing WatermelonDB — a next generation database for React and React Native. 

Here's why you should care: 
- Highly scalable. Works as well for 20,000 database records as it does for 100. Instant launch. No matter how much data you have, the app still launches with near-zero performance penalty 
- Lazy loaded everything. Don't load all data at launch, query only the exact records you need. That's why it's fast! 
- Fully reactive. All records and queries are observable using RxJS. A change in one place propagates to all other places automatically 
- Made for React. Comes with a HOC so you can declaratively tie together data and components 
- Relational. Document stores are simple, but relational databases are powerful. Want to find, say, all posts that have a comment by user X? Sure, that'll be about a millisecond. 
- Cross-platform. Works on iOS and Android (using SQLite), on the web (using LokiJS), and it's easy to add more 
- Performant. Uses asynchronous processing, multi-threading (also on the web), resource sharing, and caching to squeeze extra performance 
- Built for sync. Comes with syncing primitives so you can supply your own synchronization code

Next-generation React databases

react-native-paper has always tried to deliver first class components for your React Native application. Highly adaptable, accessible and theme awareness for both Android and iOS following material design guidelines in a strict way. In this lighting talk we are gonna explore what we can do with Paper and discover everything that the team has been working on the past few months.

We are going to walkthrough the present and the future of Paper. And just FYI, we have a surprise prepared for today so stay tuned till the end!

Paper: Welcome to Material Design 2.0

This talk aims to familiarize you with Native topics(of Android & iOS), essential to your React-Native development.

The topics covered in the talk are: 
- Understanding “bridge” between JS and Native 
- Understanding Push Notifications for Android & iOS 
- Android & iOS Permission model 
- Android Build system & Manifest 
- iOS Build system (XCode, Info.plist) 
- Overview of where Android and iOS is heading in the future and what it means for React-Native developers

Understanding "Native" in React Native

React Native allows you to re-use your React code to build native applications. What’s not to like? This approach is simple in theory but challenging in practice. In this talk, you’ll learn how to go truly cross-platform, how to transform web applications into native applications and vice versa. 

Which parts can be used both in web and native, and which ones can't - and why? What are the intricacies of shared code bases and how do we handle cross-team communication when building web and native apps at the same time? With real-life examples, code snippets, and memes, you will learn everything you need to know to get started on your native journey.

Going Native: Reusing Code

A case study on a React Native app that relies heavily on a bluetooth device: 
- Quick introduction to BLE devices
- How to deal with Bluetooth in React Native - available libraries, configuration
- Will Bluetooth work when my app is in the background?
- How to reuse code with different platforms (e.g. Electron on desktop)

Slides: https://app.ludus.one/03937bba-f6ad-4267-b8ce-8ba91eddfbbe

Building Bluetooth powered App

Not everyone is happy with the hardware and software offered by Apple with their MacBooks. However for iOS app developers there is no other choice but using an Apple Computer. But is that really true? No! With React Native there are ways to work around this necessity. In my talk I want to depict the possibilities of developing iOS apps on a linux machine.

Developing iOS apps on Linux

Bringing to the next billion devices

Expo SDK (part of Expo toolchain) is an open-source library built around React Native, allowing developers to access native components and APIs without too much fuss. Until recently it has been a big monolith, it was hard for developers to either remove unused APIs from their bundle or to use some Expo code in vanilla React Native applications. 

We’ve decided it is time for Expo to be redesigned and split into multiple, separate native + JS (+ more 🤭) libraries which developers will be able to opt-out of using in Expo standalone apps and also to use in their plain RN projects. 

This talk will describe the process of making this transition, design of the solution we’ve settled on and difficulties we had to overcome along the way (and how we’ve done it).

Chopping Expo up into universal modules to take over the world

Machine Learning is a buzzword, because big companies love it. Big companies love it, because it's insanely cool. Join me as we cover the breath-taking aspects of Machine Learning (ML) and dive deep into how it's currently showing up in mobile; especially React Native. We'll touch the tip of the iceberg and spark ML creativity for everyone!

Taming the Machine (feat. Nicolas Cage)

Over the last three years, I’ve spoken to hundreds of React Native developers, and slowly a picture emerges. It’s a picture of excitement and frustration, obsession with technology and pushing the boundaries. It’s a picture of you. This talk will blend meticulous research, subjective personal experiences and speculative fiction to discover the core of that elusive Developer Experience, and ask the inconvenient questions you’ve always been afraid to ask.

This is a Talk About You

React Native uses Metro for building the JavaScript code that runs on the devices, both during development and production.

In this talk you'll learn the main concepts about bundling JavaScript code (both for web applications and React Native) and the architecture of Metro, which is focused around build speed.

Slides: https://speakerdeck.com/rafeca/building-js-bundles-for-react-native

Building JavaScript bundles for React Native

Hot reloading—the ability to push over the air updates to published apps and the promise of having your app “just work” out of the box on Android as well as iOS—make React Native a tempting proposition for frontend developers. But what do you do when you have to integrate React Native into a large existing native code base?

This talk is from the perspective of an experienced native iOS developer who has worked with React Native to ship several cross-platform Greenfield and brownfield apps.

Things I will talk about: 
- Overview of the challenges involved in integrating React Native into an existing app
- A real life case study integrating React Native into a native app with millions of users
- Strategies for passing data and events in a brownfield app
- Strategies for deciding what’s a good candidate to port to React Native and what’s not
- Working with build systems like CocoaPods
- Dealing with an existing navigation system
- How to do CodePush in a brownfield app
- How to handle navigation in a brownfield app
- Best practices for working with Native engineers
- Example brownfield application
Extra notes: This is a new talk based on work I did for a client with a large existing native app used by millions of users.

Brownfield: Lessons from the Trenches

Most user interfaces in mobile applications are visually attractive. And it’s always a huge pleasure for developers to work together with talented designers. However an excellent UI requires even more - the art of telling a story. 

My presentation is about enhancing the UI and UX by taking advantage of animation capabilities in React Native. During the talk, you will learn in practice when and how animations should be used and how to create an alluring story for the application.

Better User Experience With Animations

While Animations can be created in React Native pretty easily, real world mobile apps require a combination of several layers of animations, gestures and micro interaction animations to make user experience stand out. In this talk we will walk through the process from defining complex animation, to implementing it by going through all stages of animation creation process.

Demystifying complex animations creation process in React Native

This presentation will focus on core projects the React Native team is working on, particularly regarding the re-architecture of the framework.

The state of React Native

A/B testing is a common practice in web world. Should that button say "click here" or "learn more"? Will the layout of your homepage materially impact app downloads? Instead of going with your gut, let data drive your product development. 

I will be talking about how to do that in the app world using React Native, both for iOS and Android and the complexities around it. Also I plan to cover these aspects:
– Why should you use A/B testing in your business?
– What all can you test using A/B testing? 
– How can you do efficient A/B testing of change in your product?

A/B testing with React Native

Developers constantly strive to make stunning apps which not only solve day to day problems but augment life of their users in a way that the app becomes an important part of their lives. The examples of such disruptive apps is endless but at the same time it’s also important that an app for many does not leave few behind. In our quest for building next great app Apple and Android both provides apis to keep accessibility integral part of application design. 

In this talk I’ll be introducing this concept to every React Native developer and give hands-on how they can make use of voiceover, accessibility properties and other accessibility elements part of their RN app to make an application inclusive for all. I am equally excited to talk and give demo on this topic since such reminders have far reaching effect on developer community when they build their next app.

Building apps for everyone - Accessibility with React Native

The Native part in React Native can look very scary and intimidated but is does not have to be that way, so in this talk you will see what the most frequent challenges are when working on the native side of React Native and how to conquer them. 

If you attend this session you see and learn how to solve a lot of native issues that pop up when working with React Native native code and modules.

- The basic of the React Native native module
What Is a native module in react native, what are all the moving parts, how do the function in the total process of react native and what is the potential
- Extending native modules
Native modules are easy extendable, you can use other languages like Swift or Kotlin and even other platforms (Windows/Mac). Also you can extend existing native modules form others if you want to
- Building
Showing what happens when building, how to solve build errors, solving dependencies and to release when building succeeded
- Tips & Tricks
Some more tips and tricks when working with native code in your react native project which I encountered in my career.

Getting to the Native in React Native

React Native EU 2018 Q&A session with Quinlan Jung (Expo), Eli White (Facebook), Harry Tormey, Matt Hargett (PlayStation), Akshat Paul (McKinsey & Company).

Q&A Panel

Thank you!

Krzysztof Borowy from Callstack conducts interviews with conference speakers:
Gant Laborde - InfiniteRed
Krzysztof Magiera - Software Mansion
Quinlan Jung - EXPO
Mike Grabowski - Callstack

Interviews with Speakers

React Native EU 2018 2nd edition took place on September 5-6th in Wroclaw, Poland, as the conference focused exclusively on React Native. It was preceded by two-day workshops session.