Remote
In-person

June 17 Schedule

Please mind that the live stream & in-person program are identical in content, however, each starts at a different time. The in-person program starts at 9:00 CEST whereas the live stream starts at 13:00 CEST.

Times below are shown in your local browsers time zone.
2022-06-17T11:30:00.000Z
2022-06-17T11:40:00.000Z
Spotify, UK
Impact: Growing as an Engineer

Becoming a web engineer is not easy, but there are tons of resources out there to help you on your journey. But where do you go from there? What do you do to keep growing, and to keep expanding the value you bring to your company? In this talk we’ll look at the different kinds of impact you can have as a web engineer. We’ll walk through what it means to take on bigger, more complex projects, and how to scale yourself, and grow the community around you. By driving our own development we can all grow our impact, and in this talk, we’ll discuss how to go about this.

2022-06-17T12:00:00.000Z
2022-06-17T12:10:00.000Z
Nozzle.io, USA
5 Years of Building React Table

Join me as a I dive into the history of React Table and discuss everything it’s taught me (both successes and failures!) since I built the first component-based version 5 years ago. We’ll cover tons of sub-topics including, but not limited to: .... takes a breath ... Headless UI, React Hooks, Advanced TypeScript, Branding & Naming-Things, Build Pipelines, Open Source Software, API Design, React/JavaScript performance and even Framework Agnostic Tooling!

2022-06-17T12:30:00.000Z
2022-06-17T12:40:00.000Z
Reacting to Web3 - Jonathan Sheely

What are the opportunities available to web devs in web3? What problems are they likely to face transitioning to web3? How the Decentology's Hyperverse solves these problems and can help them avail of these opportunities.

How React Applications Get Hacked in the Real-World - Liran Tal

React has a great security standard as default, but if you don’t pay close attention to the details you could get burned by some of the escape hatches APIs, or even by just passing props insecurely to components. I’ll teach you how to avoid these pitfalls.

AG Grid's New React Rendering Engine - Niall Crosby

AG Grid is the industry standard JavaScript datagrid for building data centric Business Applications. Recently the AG Grid team redesigned the grid to implement the React Rendering Engine in 100% React code. Given the complexity of a datagrid, this was a very challenging task. Hear from Niall, the founder of AG Grid, about the journey of this migration including how this was achieved, lessons learned along the way, and how it will impact your React applications using AG Grid.

The Only Way to Eat an Elephant - Code Splitting With Server Side Rendering - Lena Zhukova

Code splitting is a way to optimize the performance of our app by shipping less code to the end users. The most common form of code splitting is to use dynamic imports after a user interaction. In our case, we’re going to talk about conditionally loading only the parts of the application that we need during server side rendering. We’re going to discuss the problems and the solutions, so you could try it out in your own project.

Keeping Sane with React Micro-Frontends in Production by Applying Observability - Konstantinos Leimonis

Teams are getting bigger by applying micro-frontends using React, but complexity tracking production issues can become extremely confusing when no clear responsibilities are met. That’s when observability for teams and applications on a scale becomes even more important, in order to be able to identify potential issues in production, separate the concerns and the responsibilities among them. In this presentation we’ll learn how we can achieve this.

2022-06-17T13:15:00.000Z
2022-06-17T13:35:00.000Z
null, USA
The Art of Functional Programming

Functional Programming (FP), a paradigm in which programs are made up of pure, stateless functions, is adored by many programmers for how easy it makes it to predict, test, and debug the behavior of the code we write. Although FP has an unfortunate reputation as an ivory-tower domain full of obscure jargon comprehensible only to those with PhDs in category theory, the core concepts are straightforward ideas all of us can understand, and even have fun learning!

In this talk, we’ll create generative SVG art as a way to explore fundamental FP concepts such as recursion and function composition, and tackle the practical challenges of FP in the real world, such as dealing with the tricky parts like side effects and randomness which don’t fit into the safe, sterile world of pure functions. By the end of the talk we’ll not only have the key concepts & techniques we need to start writing our own functional programs, we’ll have some pretty functional art to look at too!

2022-06-17T13:55:00.000Z
2022-06-17T14:05:00.000Z
2022-06-17T14:35:00.000Z
Remote, Germany
From Blender to the Web - the Journey of a 3D Model

Creating 3D experiences in the web can be something that sounds very daunting. I’m here to remove this idea from your mind and show you that the 3D world is for everyone. For that we will get a model from the 3D software Blender into the web packed with animations, accessibility controls and optimised for web use so join me in this journey as we make the web more awesome.

2022-06-17T14:55:00.000Z
2022-06-17T15:05:00.000Z
2022-06-17T15:15:00.000Z
Tia, USA
You Do Have Time to Build it Twice

If you don’t have time to build it right, when will you have time to build it twice? In hyper growth startups the old adage breaks down. You get an expanding time horizon – IF you can get it shipped. An imperfect feature next week beats the perfect feature 2 months from now. Your code won’t matter if you’re dead. I didn’t believe this until I saw it myself. A startup on the cusp of hockeystick hired me to rewrite their jQuery app in React. Their tech proved the idea then became a burden. Over the next year we rewrote the whole app from scratch, grew a team of React experts, created a codebase that’s a joy to work with, and got the company to a $100,000,000 Series B. All because the early engineers knew that if the crappy version works out, there’s going to be time and resources to fix it later. This talk is about what I’ve learned while rewriting an app with users banging down the door.

2022-06-17T15:35:00.000Z
2022-06-17T15:45:00.000Z
Vercel, UK
Routing in React 18 and Beyond

Concurrent React and Server Components are changing the way we think about routing, rendering, and fetching in web applications. Next.js recently shared part of its vision to help developers adopt these new React features and take advantage of the benefits they unlock.

In this talk, we’ll explore the past, present and future of routing in front-end applications and discuss how new features in React and Next.js can help us architect more performant and feature-rich applications.

2022-06-17T16:05:00.000Z
2022-06-17T16:15:00.000Z
CodeSandbox, Netherlands
The Journey of CodeSandbox Projects

CodeSandbox Projects is the new version of CodeSandbox that enables the workflow of CodeSandbox today, but for projects of any size. During this talk, Ives will share the story of how Projects was created, and how we made it technically possible to build Projects.

2022-06-17T16:35:00.000Z
2022-06-17T16:45:00.000Z
2022-06-17T17:05:00.000Z
GitHub, Netherlands
Walking the Line Between Flexibility and Consistency in Component Libraries

Design systems aim to bring consistency to a brand's design and make the UI development productive. Component libraries with well thought API can make this a breeze. But, sometimes an API choice can accidentally overstep and slow the team down! There's a balance there... somewhere. Let's explore some of the problems and possible creative solutions.

2022-06-17T17:25:00.000Z
2022-06-17T17:35:00.000Z
Nearform, France
Full-stack JS today: Fastify, GraphQL and React

First there was LAMP, then there was MEAN and JAM. But now it’s 2022 and times have changed… What does the modern full stack look like? It’s built entirely from free and open source technologies, it’s scalable beyond imagination, it can run on premise or in the cloud, it should get out of the way and not lead to vendor lock-in, and most importantly it should “just work.” There are so many tools to choose from. Choosing the right stack from day one can be the difference from project success to smoldering pile of software ashes. Using fastify, mercurius, urql, and react we can build high performance full-stack applications using all javascript technologies.

2022-06-17T17:55:00.000Z
2022-06-17T18:05:00.000Z
Medallia, Czech Republic
Inside Fiber: the in-depth overview you wanted a TLDR for

I want to provide an in-depth overview of the important concepts behind reconciliation. We'll then explore how React uses the algorithm and go through a few magic words we hear a lot, like coroutines, continuations, fibers, generators, algebraic effects and see how they all relate to React.js.

2022-06-17T18:25:00.000Z
2022-06-17T11:40:00.000Z
Xata, Germany
Handling Data at Scale for React Developers

It is very difficult to scale modern web applications to millions of concurrent users. Oftentimes, we've got to provision and consider in-memory Key/Value stores, search engines, analytics engines, and databases, all while preserving traceability through the layers. This talk expands on the technical details of web apps at this scale, and offers a simpler way to achieve the same effect without the technical hassle.

2022-06-17T12:00:00.000Z
2022-06-17T12:10:00.000Z
Google, USA
Next.js and Chrome

A small team of Google Chrome engineers are working full-time to improve both the user and developer experiences of open-source frameworks. This talk will dive into why Google is investing in this space as well as cover a number of high-impact features we’ve shipped that have improved Next.js’ default experience.

2022-06-17T12:30:00.000Z
2022-06-17T12:40:00.000Z
Don't Forget React Memo - Khrystyna Landvytovych

React developers intrigue us with the so-called React Forget compiler [that’s supposed to inject useMemo and useCallback into code automatically]. However, we still can't figure out best practices for useCallback, useMemo, and React.memo when we write it on our own. The worst scenario is if we continue to put it everywhere without understanding. As a result, it can bring noticeable harm to the performance of our application. In this talk, on real-life use cases, you will see solutions to the problem of using hooks wrong or overusing them!

Deciphering Design Systems - Billy Purvis

"Why have 1 design system when you can have 20!" Well, it turns out, it's a nightmare, and connecting them back together is even harder! I'll decipher what they are and shift your focus from the tech to the people! (psst, they're people problems masquerading as technical!) You'll find out why the heck a button component took a year to build, and the challenges behind it.

Enabling Next Generation of Designer-Developer Collaboration with ES Modules - Vova Guguiev

Collaboration process between designers and developers has been long overdue for a revision. The current version of it, essentially built around designers handing off static images with annotations to engineers, is wasteful and inefficient. We will talk about how modern design tools that embrace web standards can revolutionize this process.

Localization for Real-World Use-Cases: Key Learnings from Onboarding Global Brands - Simeon Griggs

i18n isn't easy, but with careful planning of your content model I'll show you how to structure the setup, authoring, and querying of localized content. Covering whole-or-part translated documents, the difference between market and language-specific content, ways to author that in a CMS like Sanity, and ways to query for it on frontends like Next.js and Remix.

Content Modeling for React Developers - Harshil Agrawal

In today's world, it's no surprise that "Content is King". It helps in telling a story and helping you reach out to more people. Most of the time, developers aren't the ones managing this content. Hence, modeling content efficiently becomes crucial. Doing it well makes the content delivery process smooth for the team. But how does one go on with modeling content? What are the things that one should take care of? I'll answer such questions in this talk, and share my approach to content modeling as a React developer.

2022-06-17T13:15:00.000Z
2022-06-17T13:35:00.000Z
Pyn, Australia
Let’s Talk about Re-renders

React is a fantastic tool to implement complicated applications fast, we all know it. But are they going to be fast when implemented fast? Let’s talk about re-renders and their danger in react: how easy it is to make a mistake, why some small mistakes can have a huge downstream effect, and how to avoid and prevent them.

This is a deep-dive type of talk, that focuses on why React components re-render, what kind of performance impact it can have, and what to do about it.

2022-06-17T13:55:00.000Z
2022-06-17T14:35:00.000Z
DAZN, UK
React Microfrontend Applications for TVs and Game Consoles

DAZN is the fastest-growing sports streaming service and during this talk, we will consider our experience building tv applications (for ps5, xbox, LG, Samsung and other targets) with micro frontend architecture. You may expect time travel to see how it started and what we have at the moment, what makes tv development different compared to the web, same as techniques that allow us to share code between targets. You will learn how we test our application with an in-house remote testing lab as well as our deployment and release process.

2022-06-17T14:55:00.000Z
2022-06-17T15:05:00.000Z
2022-06-17T15:15:00.000Z
Formidable, UK
Exploring AR Try-On with React Native

React Native can be much more than a toolkit for building mobile UIs in JavaScript. We’ll explore how to use features beyond the core library, and use the built-in native module system to integrate AR capabilities into your mobile app.

2022-06-17T15:35:00.000Z
2022-06-17T15:45:00.000Z
Synappz Digital Health, Netherlands
Infiltrate Your Own React Native App

Ever wondered how hackers can compromise your app and your app data? In this talk you will see how to infiltrate your own app with different techniques like decompiling, sniffing, etc.. By the end of the talk, you'll walk away a little bit scared but more prepared with some great practices to infiltrate your own app and the knowledge to battle them.

2022-06-17T16:05:00.000Z
2022-06-17T16:15:00.000Z
2022-06-17T16:35:00.000Z
Guild, Canada & UK
React Native Everywhere

Developing for each platform individually is so 2010s. These days, with React Native’s component system providing base-level UI constructs, we can efficiently develop for every platform while not sacrificing any particular platform’s uniqueness. Taz will review the approach they’ve taken while developing Guild, and the creation of their Mondrian cross-platform responsive design system as well as how they’ve accommodated the differences in navigational experiences across platforms to accomplish a codebase that can be 95+% shared across every platform.

2022-06-17T16:55:00.000Z
2022-06-17T17:05:00.000Z
Shopify, Canada
The Apollo Cache is Your Friend, if You Get To Know It

In this talk, I plan to discuss how the apollo cache works in practice, how important ID's are to the process and how one can leverage it (through the way they query/mutate and through schema design). To add to this I want to share some caching patterns and best practices used at Shopify and beyond to solve problems.

2022-06-17T17:25:00.000Z
2022-06-17T17:35:00.000Z
RedwoodJS, USA
Design-Driven Full-stack: an End-to-End Dev Workflow that Scales

I’m going to show you something you haven’t seen before — a simple, integrated workflow made possible by React, RedwoodJS, and Storybook. We’ll start from scratch, generate code for components, design and mock state, then finish with a secure API and CRUD UI.

Sounds hard? It was. But not anymore! 🤯

You’ll learn how to bridge existing development gaps between stateful designs, data fetching, and your API using Redwood Cell components — a one-stop-React-shop for fetch, state, mocks, and design. Teams can move faster. Solo devs can iterate more quickly. And there are secondary benefits from documentation to security to accessibility, which add up to improving long-term maintainability at scale.

Get ready to be inspired by what you’ll be able to build!

2022-06-17T17:55:00.000Z

June 21 Schedule

Times below are shown in your local browsers time zone.
2022-06-21T13:00:00.000Z
2022-06-21T13:15:00.000Z
Chromatic, USA
Tame the Component Multiverse

Error state, loading state, awkward breakpoint, bad data, poor formatting, browser support. Every component is a multitude of challenges. How do you actually manage it? Disable the network — temporarily. Insert bad code — just for a minute. Paw at the edge of your screen. Hack local database fixtures to bits. Frontend development is a multiverse where dimensions like time and variation result in an infinite number of UI possibilities. In this talk, we'll use Storybook to progressively develop, test, document our work and tame the multiverse of our components.

2022-06-21T13:40:00.000Z
Axonius, Israel
Sharing is Caring: (How) Should Micro Frontends Share State?

Micro frontends architecture is extremely powerful when it comes to splitting large frontend monoliths into smaller, individually deployable blocks, each is owned by an autonomous team and is focused on a business domain. But what about State? We are often told that micro frontends shouldn't share state, as this would make them coupled to each other. However, when it comes to complex UIs, it is not rare to encounter scenarios where state management between micro frontends is necessary. This talk is about finding the sweet spot — In which scenarios it is reasonable for micro frontends to share State? and how should micro frontends share State while remaining decoupled of each other? We discuss & compare different solutions in React.

2022-06-21T14:05:00.000Z
Wilco, Israel
Multiple apps, one code to rule them all

More and more, React is being used for complex apps that accommodate numerous types of users, workflows, and mechanics. Sometimes it’s different people who each use part of the app, but a single-user multi-workflow scenario isn’t uncommon as well.

In this session, we’ll learn about our options when building multiple experiences within a single React app — without losing our sanity. I’ll use some examples from what we do at Wilco.

2022-06-21T14:25:00.000Z
Theodo, France
Scale Your React App without Micro-frontends

As your team grows and becomes multiple teams, the size of your codebase follows. You get to 100k lines of code and your build time dangerously approaches the 10min mark 😱  But that’s not all, your static CI checks (linting, type coverage, dead code) and tests are also taking longer and longer...

How do you keep your teams moving fast and shipping features to users regularly if your PRs take forever to be tested and deployed?

After exploring a few options we decided to go down the Nx route. Let’s look at how to migrate a large codebase to Nx and take advantage of its incremental builds!

2022-06-21T14:45:00.000Z
Octopus Energy, UK
Introducing Design System to Multinational Web Apps

I will walk through the process of my team introducing design system to our company's web applications that are built separately in different countries - UK, US, Germany, Spain and Japan. After that, I will add a practical guide to set up a design system for a project.

2022-06-21T15:05:00.000Z
NearForm, Italy
You don't want to Server-side Render your Next.js App

Next.js is a fantastic framework; it provides many unique features, helping you build any web application effortlessly. But when it comes to choosing the right rendering strategy for your pages, you may face a problem; how should I render them? Should I statically generate them at build time? Should I server-side render them at run-time? Well, the answer is surprising. server-side rendering is rarely the best option, and let's explore why (and how to solve this problem!)

2022-06-21T15:35:00.000Z
Duda, Israel
Dear Client, I'm Leaving You

With React Server Components and React’s new suspense SSR capabilities, we get an paradigm shift in the world of client/server side rendering. The pendulum that started in plain HTML pages, quickly swinged to all-client-rendering, is now returning to the server side. Emerging frameworks like Next.js and Remix usher a new era of web development, one where SSR is a first class citizen. In this talk we deep dive into those React features, talk about the state of the art practices regarding server rendering, and maybe get a glimpse into the exciting future of front-back-full-stack relationships.

2022-06-21T15:55:00.000Z
2022-06-21T16:00:00.000Z
Avoiding CSRF with Remix - Lee Rowlands

Remix 'Data Writes' go back to the basics of the web when it comes to form submissions. But therein lies a trap if you're not careful - Cross site request forgery (CSRF) can rear its head. In this session we'll explore what CSRF is. How it can be exploited and what you can do to make sure your Remix application isn't vulnerable.

How to Share Code between React Web App and React Native Mobile App in Monorepo - Emily Xiong

Usually creating web and mobile apps require different tech stacks, and it is pretty hard to share code. This talk will show how I added a React web app and a React Native mobile app in the same monorepo using Nx, and how I optimized codeshare between react web app and react native mobile app.

Automated Application Security Testing - Scott Gerlach

Traditional security testing for JS apps has focused on the front-end, but actual security issues most often lie in the backing REST API. Join StackHawk co-founder Scott Gerlach for a quick overview of why you need to rethink how you test your JS apps and how StackHawk can help you find and fix security bugs fast.

Using React Hooks + Capacitor to Access Native Mobile APIs - Thomas Vidas

Using Capacitor, you can easily create native mobile iOS and Android applications using all of the React web tools you know and love. But how do we access the native APIs? With the @capacitor-community/react-hooks package, we can quickly and easily access native device APIs, like Camera, Filesystem, and Geolocation, using React Hooks!

2022-06-21T16:30:00.000Z
WP Engine, USA
Remixing WordPress: Building a Headless Site with Remix, WPGraphQL, and Web Fundamentals

One of the largest draws of headless or decoupled WordPress architecture is that we can endlessly remix the WordPress CMS that content creators love with the latest and greatest of web technology. This presentation will demonstrate how quickly a developer can get up and running with headless WordPress development using the Remix full stack framework. Using open source tools like WPGraphQL and Atlas Content Modeler, you can transform your WordPress site into a powerful headless CMS that serves data via GraphQL. We’ll see how we can query for and use that data in a Remix app, and also discuss how the framework’s focus on web fundamentals can benefit both the developer and the visitors who use our sites.

2022-06-21T16:50:00.000Z
Polygon, USA
A Frontend Developer’s Guide to Web3

There is a lot of hype and interest around diving into the Web3 space, and it can be hard to manage the information overload and the emphasis on learning new languages to work on smart contracts. Many developers in the frontend space ask, “How much of this new information do I need to transition into web3?” The truth is as a React developer, the skills I know are essential in web3. Let’s add some context around how to leverage those existing skills to succeed in this new space.

In this talk, we’re going to explore how to build the correct context and the technologies to understand to help you dive into web3 as a front-end developer. We’ll go over popular packages like Ethers, which can be used in React applications to interact with wallets and existing smart contracts. We will also explore how you can leverage your Javascript skills to build full-stack dApps using managed services like Moralis and Thirdweb.

Let’s demystify some of the concepts in web3 and leverage our existing skills to start building.

2022-06-21T17:15:00.000Z
Snyk, India
New Way of Envisioning Security in the Dependencies

The vulnerabilities in open source ecosystem are increasing like wild fire. It is important to address those. I will be speaking about issues and how to fix them with demo. I will pick up examples from React ecosystem as well.

2022-06-21T17:35:00.000Z
Rangle, Netherlands
Find Out If Your Design System Is Better Than Nothing

Building a design system is not enough. Your dev team has to prefer it over one-off components and third-party libraries. Otherwise, the whole effort is a waste of time. Learn how to use static code analysis to measure if your design system wins over the internal competition and data-driven ways to improve your position.

2022-06-21T17:55:00.000Z
Findlay Web Tech, UK
Composition vs Configuration: How to Build Flexible, Resilient and Future-proof Components

There are many ways of authoring components in React, and doing it right might not be that easy, especially when components get more complex. In this talk, you will learn how to build future-proof React components. We will cover two different approaches to building components - Composition and Configuration, to build the same component using both approaches and explore their advantages and disadvantages.

2022-06-21T18:15:00.000Z
Zenc Labs, Australia
Improving Developer Happiness with Preview.js

A look into Preview.js, an open-source extension for Visual Studio Code, IntelliJ and WebStorm that lets you preview individual React components instantly, updated as you type.

2022-06-21T18:35:00.000Z
2022-06-21T18:50:00.000Z
2022-06-21T13:00:00.000Z
2022-06-21T13:15:00.000Z
Shopify, Canada
Sharing is Caring: Reusing Web Data Viz in React Native

At Shopify, the Insights team creates visualization experiences that delight and inform. We've done a lot of great work prioritizing accessibility and motion design for web. Our mobile experiences though, were a bit of an afterthought, but not anymore! In this talk, we'll go through how we created our data viz components library; How we encapsulated core logic, animation, types and even UI components for web and mobile; and also why keeping things separate sometimes is better - to create awesome UX.

2022-06-21T13:40:00.000Z
JustWatch, Germany