The Original React Conference in Europe
ReactEurope
We still plan to run all our workshops online. As for the conference, we will be running it online with access to speakers who have gracefully accepted to be part of the stream, make sure to subscribe here to the stream open to all 🌎 🎥
May 14-15th, 2020 (online conference)
May 12-13th-16th, 2020 (online workshops)
2021 (next year's conference edition)
Paris, France
Conference Events
ReactEurope is historically the place where many new industry standards in the React community are revealed to the world such as the first public demo of redux and time travel, the release of GraphQL, react native reanimated, mobx-state-tree and more.
ReactEurope is the original European Conference since 2015 (second only to facebook's react conf worldwide) and we are excited to be back in May 2020 for our 6th edition online.
Our Next edition after that will be on May 20th - 21st, 2021 in Paris.
After changing the way we think about state management in JavaScript applications, the way we write native mobile apps with React Native, how we interact with remote data with GraphQL or even how we manage CSS, the React community keeps innovating and its ecosystem growing.
At this conference, you will learn how new projects such as ReasonML will bring web and mobile React Native apps to the next level and how projects such as React Native Web, React Primitive and Expo make it easy to write, deploy and share code on all platforms quickly. 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, ReasonML, 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!
Our Speakers
Stay tuned for some awesome speakers announcements soon.
More
Stay tuned for more awesome speakers to be announced soon! Subscribe here to not miss new announcements.
Schedule
The schedule is in UTC+2.
Monday, 11 May
15:30 - 23:30 (Paris time, UTC+2)
Full Stack React with GraphQL and AWS Amplify Workshop
In this workshop you’ll learn how to build a serverless full stack React app using the Amplify Framework by building an events app. You’ll learn how to add authentication, protected client routes, and an authenticated GraphQL back end complete with user authorization and a profile view.
Tuesday, 12 May
09:30 - 17:30 (Paris time, UTC+2)
React.js Workshop - Day 1
Learn from the best with a 2-day workshop this May 12 and 13th from 9:30am to 5:30pm
Learn about the upcoming core features of React such as concurrent mode, Suspense for Data Fetching, server side rendering and strengthen your knowledge of the latest patterns such as hooks and other techniques in order to help you take full advantage of the latest version of React and build rock solid components with the best user experience possible.
This workshop will be done by Nik Graf and Wolfgang Goedel.
Nik is a software developer and passionate about good UX, functional programming and dev tools. He co-organizes ReasonConf and produced the free Egghead Reason course. In addition he co-created several popular open source projects like DraftJS Plugins & Polished. In his spare-time he enjoys cycling & skiing.
15:30 - 23:30 (Paris time, UTC+2)
React Native Workshop - Day 1
Learn from the best with a 2-day workshop this May 12th and 13th from 3:30pm to 9:30pm with Eric Vicenti, the creator of React Navigation and aven.io, and Jon Samp, React Native dev at CodeCademy and creator of react-native-header-scroll-view. This workshop will teach you how to write professional user experience using React Native with animation, fast navigation, transitions, performance, web and more. Here is the outline of the workshop:
- Setting up
- Navigation
- Performance
- Gestures: react-native-gesture-handler
- Animations: Animated → react-native-reanimated
- Testing
- Unimodules
- Production
- Web
You can read more details here.
The workshop requires an intermediary level in React.js and React Native (>= 3month experience).
Creator of Aven, a full-stack framework for web and React Native apps. Author of React Navigation. Formerly on Facebook’s open source team and the React Native team.
Software engineer, @expo. Love JavaScript & React Native. singleoriginapp.com
Wednesday, 13 May
09:30 - 17:30 (Paris time, UTC+2)
React.js Workshop - Day 2
Learn from the best with a 2-day workshop this May 12 and 13th from 9:30am to 5:30pm
Learn about the upcoming core features of React such as concurrent mode, Suspense for Data Fetching, server side rendering and strengthen your knowledge of the latest patterns such as hooks and other techniques in order to help you take full advantage of the latest version of React and build rock solid components with the best user experience possible.
This workshop will be done by Nik Graf and Wolfgang Goedel.
Nik is a software developer and passionate about good UX, functional programming and dev tools. He co-organizes ReasonConf and produced the free Egghead Reason course. In addition he co-created several popular open source projects like DraftJS Plugins & Polished. In his spare-time he enjoys cycling & skiing.
09:30 - 17:30 (Paris time, UTC+2)
Modern Forms in React
This workshop will take the students from building a two-field form using just useState() hooks but also useReducer() through to using a form library to manage complex form data such as field arrays, with support for field-level and record-level client-side validation as well as submit validation, third party input components and more. It will also touch on more complex concepts like minimizing field re-renders with a useField() hook, as well as subscribing to certain parts of form state with a useFormState() hook.
Beyond only forms, the app we build will talk to a GraphQL backend to load data into the form and mutate it upon form submission using Apollo Client, using hooks, of course!
Students will walk away confident in their knowledge of how to build forms of any complexity with great UX.
14:00 - 21:30 (Paris time, UTC+2)
Next.js Workshop: Build a professional Next.js app with the core team
Learn to build a professional Next.js app in a day with the very core team from Next.js including Luis Alvarez and JJ Kasper.
- Introduce Next.js (what is it, what values it provides)
- Explain Next.js' Router (pages/ or src/pages)
- Explain and Demo Dynamic Routing
- Showcase automatic prefetching for fast performance (and how to disable for seldom visited pages)
- Introduce API Routes, showcase hot reloading
- Introduce TypeScript Support
- Fetching Data in your Pages (with shared API type shapes 😌)
- getInitialProps
- React Hooks
- Explain benefits / drawbacks of both
- Authentication example
- Deep dive into Next.js environment (build vs runtime)
- Maybe include how to manage, .envrc or dotenv
- Heavy CMS or Static content example
- Maybe Notion blog example
- Showcase AMP support
- Showcase client-side only rendering technique
- Maybe showcase internationalization (?)
- Show how to integrate with styled-components (considerations of SSR and CSR)
The workshop requires beginner-to-intermediate React skill and beginner skills in TypeScript.
15:30 - 23:30 (Paris time, UTC+2)
React Native Workshop - Day 2
Learn from the best with a 2-day workshop this May 12th and 13th from 3:30pm to 9:30pm with Eric Vicenti, the creator of React Navigation and aven.io, and Jon Samp, React Native dev at CodeCademy and creator of react-native-header-scroll-view. This workshop will teach you how to write professional user experience using React Native with animation, fast navigation, transitions, performance, web and more. Here is the outline of the workshop:
- Setting up
- Navigation
- Performance
- Gestures: react-native-gesture-handler
- Animations: Animated → react-native-reanimated
- Testing
- Unimodules
- Production
- Web
You can read more details here.
The workshop requires an intermediary level in React.js and React Native (>= 3month experience).
Creator of Aven, a full-stack framework for web and React Native apps. Author of React Navigation. Formerly on Facebook’s open source team and the React Native team.
Software engineer, @expo. Love JavaScript & React Native. singleoriginapp.com
Software Engineer, React Native lover, CS Student. Fan of good design and high user experience. Plays guitar, loves literature and poetry from 19th & beginning of 20th centuries as well as theoretical computer science and movies which everyone considers boring. Gets satisfaction from making things work and discovering how they work. Part of React Navigation and rainbow.me team. Works at Software Mansion in Krakow.
Thursday, 14 May
10:30 - 10:55 (Paris time, UTC+2)
Keynote
The state of react. More details coming soon.
John Adetutu is currently a frontend developer @AdaHealth(ada.com). He is a self taught developer and started his development journey when he met a guy on the train and has been in love with programming ever since. He is a polyglot with a working knowledge of various programming languages such as Rust, Golang, Reason, etc and of course Javascript. in his spare time he loves contributing to open source and playing video games.
11:30 - 11:55 (Paris time, UTC+2)
Bringing webgl to react
This talk is about react-three-fiber, a reconciler that translates react components to threejs to spice up frontend dev with some canvas magic. we will get into the history of it, benefits, hooks and a small primer to get going.
13:30 - 13:55 (Paris time, UTC+2)
Render Props are Not Dead
React has a long and storied past of abstracting away state management. First it was mixins, then HOCs killed mixins, then render props killed HOCs, and now hooks have killed render props. Or have they? There is still some value that render props can provide that hooks cannot. This talk explores that use case so that you can learn to recognize the scenario and deploy render props intelligently.
14:00 - 14:25 (Paris time, UTC+2)
Rejecting bongo kittens, achieving 3D blooms, and other lessons learned
A talk about love, pain, and lightsabers.
14:30 - 14:55 (Paris time, UTC+2)
Beyond Responsive Design: Building Mobile-Optimized Websites in React
If you’ve browsed the internet on your phone recently, you’ve probably noticed a common phenomenon: mobile websites often try to get the user away from the site and onto an app as quickly as possible. How can front end developers advocate for the strengths of the mobile web, and build experiences so good that it’s not always necessary to point the user to a native app? This practical talk will review HTML & CSS best practices and then have a look at implementing some more advanced techniques in React.
15:30 - 15:55 (Paris time, UTC+2)
Kubernetes by Keytar
In this session, you'll get a musical introduction to the basics of Kubernetes, with the help of a keytar, React, and the Web MIDI API. Attendees will learn about fundamental Kubernetes concepts such as pods, services, and deployments as we build out a visual representation of a container-based, scalable web application.
Jan Kleinert is a Developer Advocate at Red Hat, where she focuses on OpenShift and the developer experience for developers working with containers and Kubernetes. Prior to joining Red Hat, she worked in a variety of roles ranging from developer relations to web analytics and conversion optimization.
16:30 - 16:55 (Paris time, UTC+2)
Building a Design Tool for React in React
I built a Design Tool in TypeScript and React that generates React & React Native code. It's called BuilderX.
The talk is going to cover how I built it and how any React dev can build it too. The architecture was rebuilt many times using famous libraries before we found a stable solution. The busy worker thread is decoupled from React and it is heavily based on Object-Oriented Concepts (Command Pattern).
The topic of the paper starts with the basics of building a design tool and goes to the advance level of how you can build it yourself. The structure is as follows:
• High-level architecture: The interface, the data model (Undo/Redo), Code generator • The interface: • Tracking & dealing with mouse interactions • Rendering layers on the screen • Custom CSS-in-JS solution • The data model: • TypeScript classes • MobX like Observable data models • Code Generator • Generating real React (/Native) code from the tool
• The future of Visual Design tools.
17:00 - 17:25 (Paris time, UTC+2)
Hijacking CSS with tailwindCSS
In this talk, Horacio will do a very broad dive into TailwindCSS, how he is using it and give you his honest advise about why you should (or not) use it on your next project. We will cover many of its features and some techniques to accomplish a great design without writing a single line of CSS. see you there!
18:00 - 18:25 (Paris time, UTC+2)
State Management for Today's React
We present an approach to state management that scales from a single component to highly complex apps. This boilerplate-free system makes it easy to support browser history and URLs and to manage asynchronous data dependencies, and works with modern React features. We use as a case-study a sophisticated data analysis tool developed at Facebook which led us to create this system.
19:30 - 19:55 (Paris time, UTC+2)
Design system and accessibility
Devon will talk about building a design system with accessibility, internationalization, cross device (mouse/touch) support and themeability in mind.
Engineer at Adobe working on the React design systems team. Lead of the Parcel bundler project.
Friday, 15 May
10:30 - 10:55 (Paris time, UTC+2)
Flipper: The Extensible DevTool Platform for React Native
Are you a React Native developer? Have you always been longing for the rich ecosystem of developer tooling that exists for the web in e.g. Chrome and Firefox?
Flipper is Facebooks internal, extensible mobile devtool platform, used by the mobile devs that work on the Facebook, WhatsApp, Instagram and many more apps.
Recently the React Native and Flipper team have been working hard to add first class support for React Native as well. This means that monitoring network traffic and performance, using the React Devtools, inspecting device and application logs or even debugging JavaScript can now can now be conveniently done using one coherent tool.
And best of all: Flipper is extensible, so let's build our own extension while at it!
11:00 - 11:25 (Paris time, UTC+2)
Detecting the unexpected in React applications
We all know this moment: when a bug we have never thought of before pops up right at the last moment in production.
Truth is, forecasting all potential bugs with our tests is barely infeasible. Yet, what if there was still a way?
Let's investigate together what can be improved and added to our test strategies to make them even more reliable thanks to property based testing. But contrary to classical talk around property based testing, we are going to go further by extendig it to user interfaces and race conditions detection.
By the end of this talk, our CI will have been turned into an automated QA identifying issues in our UI.
Author of fast-check npm library. The library is currently used by Jest during the continuous integration step in order to detect bugs earlier. It has already been used several times to detect bugs in huge and famous npm pacakges.
From a professional point of view: I am currently working as a front-end engineer at a recently founded start-up working with React for its front. Before that I have been responsible during two years for the development and maintenance of another front application.
11:30 - 11:55 (Paris time, UTC+2)
Let’s Make Development Fast Again!
We talk very often about how we should optimise production bundles, and rightly so. But we never talk about optimising our development bundles. While we don’t have to make our development builds smaller, we can generate them much faster than the current status quo.
During this talk Ives will take a deep dive into how a bundler works, and how we can make our development process much faster. We will take a look at recent devtool releases, and why they are groundbreaking for our development workflow of the future.
Developer, traveler, tech enthusiast, working on codesandbox.io, ex-Facebook intern.
12:00 - 12:25 (Paris time, UTC+2)
Blitz.js & the Future of Fullstack
Fullstack Javascript is too hard. There’s too many choices. Too much complexity. So we created Blitz, a new Rails-like framework for fullstack React apps. It builds on Next.js and adds a new invisible data layer that removes the need to build your own API. It also brings conventions and development tooling like code scaffolding and an integrated code REPL.
13:30 - 13:55 (Paris time, UTC+2)
Learn React Hooks By Building An Auth Based To Do App
Learning React Hooks can be a little bit intimidating because it involves a different way of working with components than what most React developers may be used to. Features that were previously exclusive to class based components can now be utilised with function components. With Hooks, function components can be used to manage state, make use of a component’s lifecycle events, as well as connect to the context of React apps.
In this presentation, I will give a walk through of some of the React Hooks such as:
- Use State Hook (useState)
- Use Custom Hook (use…)
- Use Context Hook (useContext)
- Use Effect Hook (useEffect)
- Use Ref Hook (useRef)
- Use Reducer Hook (useReducer)
We'll explore the rules around React Hooks and what each of the above has to offer by building a basic to do app with user authentication so we can see these features in a real world example.
Lukonde is a software engineer at Entelect and has been contributing to “software eating the world” for the last 4 years. He enjoys sharing knowledge through medium and writes technical articles for top publications such as The Startup, HackerNoon, Better Programming and a few others. He is an advocate of serverless cloud computing with a strong affinity for AWS, and spends most of his programming time in the JavaScript space working with React, ReactNative, TypeScript and NodeJS.
14:00 - 14:25 (Paris time, UTC+2)
Gamedev on React + WebGL [Discovery Track]
Making of 2D games looks unpredictable. WebGL is fastest rendering API in web but to hard to understand. How to start making games like interfaces using well-known JSX? How much time do you need to write one? Does it make sense to write render in JSX instead of using WebGL from scratch?
This talk is based on my research for making games for marketing purposes. Games for conferences, sales, ads, etc.
Key takeaways
- Why React + WebGL is a better way to make production ready stack to make simple games.
- How to start draw something using WebGL to get faster result
- How to use shaders with canvas 2D api to make fancy render.
Frontend Engineer at Tinkoff.ru, biggest online bank in Russia. He is based in Saint-Petersburg and local frontend community co-organizer, makes regular meetups, pub-talks, breakfasts and own podcast. Aleksandr is Frontend developer with 6 years of experience. He is passionated about games development, visualization and other graphics stuff.
14:30 - 14:55 (Paris time, UTC+2)
Scalability - React Native Architecture at Wix
Have you ever though using microservices approach in a FED\mobile application? hesitating to choose React Native for your big project? I’m here to eliminate the school of thought that React Native is mostly for small mobile applications.
Wix started the journey with React Native with 4 developers and a few hundred lines of code, but grown a lot since and in order to enable ~100 Wix mobile developers, from 15 different teams, to easily integrate their code into the app, we had to rewrite the app’s architecture, implement new framework and think more like an OS to allow each team integrate their mini-app ("module") into the main Wix’s React Native mobile platform (aka "engine").
A simple analogy to better understand the relation between “Engine” & "Module", would be the same as Chrome & Extensions or iOS & Apps. This "Engine" includes principles like: Memory management & modules lazy loading, Communication channels between modules, Dependency management and code sharing.
Omri started to code on his first Intel 80386 PC when he was 12 years old. Since then, he became a mobile developer, passionate about iOS & React Native, working mostly on infrastructure & mobile performance, and React Native speaker and advocate. For the past few years, he was lucky enough to be part of scaling the Wix Mobile application. As an engineering manager at Wix, he drives talented people to create great products.
15:00 - 15:25 (Paris time, UTC+2)
How does Material-UI build components?
Get behind the scene of one of the most popular React UI framework. Material-UI contains dozens of rich components, you might have already used some of them. In this talk, we explore how these components are built and maintained. We use the autocomplete as a case study. We will explore the answers to these questions, among others. When is a new component built? How is a new component built? What influences the design? What sustains the effort?
15:30 - 15:55 (Paris time, UTC+2)
Using Expo OTA Updates in your React Native app
This talk will focus on the recently released expo-updates library that allows you to use Expo’s OTA updates in any React Native app. We’ll discuss how to set up and use the module, configuration options, and other important things to be aware of when using OTA updates.
Eric is a software engineer on the Expo team in Palo Alto. He primarily works on the iOS and Android codebases, oversees the SDK release process and has also served as the team’s engineering manager. Eric is passionate about making mobile app development fast, easy, and powerful, and empowering others to realize their ideas.
16:00 - 16:25 (Paris time, UTC+2)
JavaScript ∩ WebAssembly
In this talk we will look at some of the optimizations that JavaScriptCore uses to speed up JavaScript execution, and perhaps counterintuitively, how the same optimizations are also being applied to speeding up WebAssembly.
16:30 - 16:55 (Paris time, UTC+2)
Data sync for realtime or offline apps with React and GraphQL
Data synchronization is a natural part of life for modern applications. This could be via standard fetching techniques, realtime using websockets, or offline transitions with shared data. This talk will be a deep dive on how we built Amplify DataStore using GraphQL to handle these situations, including details of storage mediums across web and React Native platforms, local vs network serialization of types, and conflict resolution. The talk will go through both theory and practical guidance on how we built this solution over several years with production AWS customers that run React and React Native apps at large scale.
Saturday, 16 May
09:30 - 17:30 (Paris time, UTC+2)
Workshop: TypeScript for React (and GraphQL) Devs with Michel Weststrate
The React community is moving to TypeScript fast and it can be hard to keep up, what better occasion to learn about both TypeScript and how to migrate a React app to it than with Michel Weststrate who wrote MobX using TypeScript and is an expert in the field?
This workshop will take place on the 16th of May from 8:45am to 5:30pm in Paris. The JavaScript ecosystem is moving to TypeScript. Fast. This workshop will get you up and running with the basic and more advanced patterns of TypeScript. TypeScript has some powerful features, that fit very well with the dynamic nature of the JavaScript language. In this workshop we will cover all the essentials and some of the unique features of TypeScript.
GraphQL is also taking over the world and has typing included, however, it's a pity that you often have to define your typing twice, once in your GraphQL backend and then again on the client. Michel will show you how to make this process easier during the workshop.
But beyond that, this is a workshop for React devs! To practice the theory, during the hands-on parts of this workshop we will be migrating an application from plain JavaScript to TypeScript.
The workshop requires familiarity with JavaScript, React and modern syntax features (ES2015).
09:30 - 17:30 (Paris time, UTC+2)
Workshop: Build Great User Experiences with Concurrent Mode + Suspense with Relay (May 16th)
Sibelius Seraphini, one of the most proficient open source contributor in the community, will be giving a workshop on Relay.js with all the latest bells and whistle.
If like us, you religiously watched the latest presentations on how the React, Relay and Facebook webcore team cooperated to build the new Facebook F5 and if you've been wanting to build the same optimizations that come with concurrent mode into your own apps, then this workshop is for you!
- Here are some of the points you will learn:
- Best Practices for Suspense
- Load Data Incrementally: Dynamically loading code and using fragments for your components
- Render As You Fetch pattern via the preloadQuery() and usePreloadedQuery()
- Using useTransition to make route transitions more seamless
- usePaginationFragment for colocation of data-dependencies with the view and for pagination
- using the relay compiler to take advantage of TypeScript types with GraphQL types
You'll learn how to put all these techniques together to bring the best experience possible to your users.
And if it get releases by May, we'll also include the new ssr api and more.
While relay has had a reputation of being a bit more complex than other GraphQL clients alternatives, it's been way more simple and flexible since the Relay Modern release and Sibelius is a really passionate early user of it and he will make a great job of explaining it to you. Relay also remains unmatched when it comes to optimizations, cache management, concurrent mode and more.
Good knowledge of React and beginner in TypeScript and GraphQL are required.
Thursday, 21 May
09:30 - 17:30 (Paris time, UTC+2)
Workshop: Build Great Websites and Apps using Gatsby.js with the team from Gatsby
Learn to build a professional and fast websites and apps in a day with the very core team from Gatsby.js including core team member Sidhartha Chatterjee. The main topics will include:
- Getting started with Gatsby
- CSS and layout
- Querying data with GraphQL, working with CMS' like Contentful or Wordpress
- Routing, creating pages programmatically
- Accessibility
- Animations and interactions
- Authentication, having protected routes
- Leveraging the Gatsby Ecosystem with starters, plugins, and themes
- Deployment and profiling
The workshop requires beginner-to-intermediate React skill.
Get Your Tickets
Watch the 2020 edition online and make sureto subscribe here to the stream open to all 🌎 🎥
Don't miss our tickets release by subscribing here.
16 days left
20 tickets left
Location
Palace of Paris-Est Congress
128 Rue de Paris
Montreuil, France
Both workshops and conference will take place at the same venue.
The venue is close to both the CDG & ORY airports
Is accessible by subway, bus & ring road.
Palace of Paris-Est Congress
People Behind ReactEurope
What People Said
What our previous attendees had to say about ReactEurope 2019.
Event Moments
Subscribe
Subscribe to our mailing list to get the latest news here