React Day Berlin 2023
2023-12-08..2023-12-12
Berlin, Germany
[React Day Berlin 2017, React Day Berlin 2018, React Day Berlin 2019, React Day Berlin 2022, React Day Berlin 2023, React Day Berlin 2024]
who it's for
React developers, frontend engineers, frontend architects, engineering managers, React Native developers, platform engineers, OSS maintainers
topics
React Server Components; browser Web APIs; Interaction to Next Paint (INP); Astro framework advances; Durable Objects for edge state; React Three Fiber multiplayer; WebAssembly with React; Redux Toolkit 2.0; React Native performance; distributed tracing and observability; web application security practices; managing React state patterns
| title | author | length |
|---|---|---|
| React Server Components | Tejas Kumar | 21m |
Argues that React Server Components solve both data‑fetching and bundle‑size problems by rendering async components on the server, shows a working demo built… | ||
| Crafting Pristine React: Best Practices for Maintainable Code | Miguel Ángel Durán García | 22m |
Shows concrete fixes: encapsulate Redux with use-data custom hooks and avoid leaking React Redux everywhere, replace manual memoizing with measured profiling… | ||
| Superpowers of Browser's Web API | Nikola Mitrovic | link |
When writing code for the Web, there are a lot of capabilities that are offered out of the box by our browsers. If you ever wrote a File Upload component, used… | ||
| How MDX is a game changer for your React Project's Documentation | Eddie Jaoude | link |
Documentation is essential to any project and it can really "make it or break it". However documentation is time consuming to draft and can sometimes be… | ||
| Brace Your React, New Core Web Vitals are Coming | Ivan Akulov | 23m |
Google promotes a new metric Interaction to Next Paint (INP) which becomes a Core Web Vital in March 2024 and already flags big sites while other metrics stay… | ||
| The day I broke React Native | Nicola Corti | link |
4th November 2022 - It was just a regular day for the "release crew" as we were approaching to prepare the first release candidate for React Native 0.71… | ||
| Preparing for Success: A Frontend Engineer's Guide to Tech Due Diligence | Armin Ayatollahi | link |
Imagine being a knight preparing for a jousting tournament, but your horse is more interested in the fair's hay bales than your impending duel. That's what… | ||
| Panel discussion "Innovation in React" | Tejas Kumar, Sara Vieira, Mark Erikson, Miguel Ángel Durán García, Sylwia Vargas, Elian van Cutsem | link |
The talk discussed various topics related to React, including the wishlist for future versions, the importance of accessibility, reducing bundle size, and… | ||
| Empathy Driven Development | Manjula Dube | link |
Empathy-driven development empowers developers to create software that truly understands and serves users' needs. This talk explores practical techniques for… | ||
| Rethinking Bundling Strategies | Tobias Koppers | link |
We take a look at different challenges and decisions when bundling code for web applications. We look at how these are commonly solved and why we need to… | ||
| All Things Astro | Elian van Cutsem | 15m |
Astro 3 adds view transitions, edge middleware and image optimizing and claims a major refactor yields a 75% performance gain over Astro 2 (Astro 2 was ~33%… | ||
| Challenges of Decomposing a Massive Front-End Using Micro-Frontends | Oleksandr Tryshchenko | link |
Our web UI application is pretty big - hundreds of people have been actively building it during the past eight years. We started facing scalability issues and… | ||
| Frontend Frameworks | Tejas Kumar, Miguel Ángel Durán García, Daniel Afonso, Nikola Mitrovic, Atila Fassina, Nicolas Dubien, Henrik Fricke | |
-- no description -- | ||
| Growing in Your Career | Tejas Kumar, Manjula Dube, Miguel Ángel Durán García, Eddie Jaoude, Nicolas Dubien, Maya Nedeljković Batić, Armin Ayatollahi, Theodore Vorillas, Oleksandr Tryshchenko | |
-- no description -- | ||
| Durable Objects - Everything Everywhere All At Once For Not Very Much Money | Jani Eväkallio | link |
Cloudflare's Durable Objects are a new JavaScript runtime that makes building stateful, on-demand backend servers on the edge as easy and cheap as serverless… | ||
| Design Systems | Sanket Sahu, Atila Fassina, Armin Ayatollahi, Oleksandr Tryshchenko | |
-- no description -- | ||
| Multiplayer Games with React Three Fiber and WebSockets | Maya Nedeljković Batić | link |
Multiplayer games are the coolest: they bring us closer together, even when we’re battling it out. While you can’t build World of Warcraft in a weekend, you… | ||
| Bringing React Server Components to React Native | Szymon Rybczak | link |
React Server Components are new topic in community, bunch of frameworks are implementing them, people are discussing around this topic. But what if we could… | ||
| Javascript Should Come With Batteries | Luca Casonato | 24m |
Claims that JavaScript runtimes should be batteries included and demonstrates a concrete stack: native TypeScript and JSX support, built-in testing linting… | ||
| Exploring React Server Component Fundamentals | Daishi Kato | 21m |
Demos use Node.js plus the canary React packages and react-server-dom-webpack to show that RSC serializes JSX into a stream (renderToPipeableStream) and… | ||
| Hacking an e-Reader to Show My Tea Menu With JSX | Tiger Oakes | link |
I wanted to have a tea menu to show guests and for my own reference. Turns out e-Readers use so little power and can render HTML! I'll share how to generate an… | ||
| A Tale of the Flip Floppers. From Engineer to Manager and Back Again | Matt Colman | link |
I've flip flopped between engineer and manager three times already. I'm quite aware that this is not an unusual thing to do. There's a heap of flip floppers… | ||
| The Anatomy of Webpack: A Deep Dive Into Its Architecture | Nitin Kumar | link |
Webpack is a powerful tool for building modern JavaScript applications, but its architecture can be complex and daunting for developers who are new to it. In… | ||
| Building Enterprise-grade GraphQL APIs with Domain-Driven Design and Clean Architecture | Petar Ivanov | link |
In this talk, we will explore how to build scalable and maintainable GraphQL APIs for enterprise applications using Domain-Driven Design and Clean Architecture… | ||
| Pushing Boundaries to the Edge | Facundo Giuliani | link |
While the technology goes further and further, web development tries to get closer to the user. CDNs and web servers are evolving, and they now offer us the… | ||
| React's Most Useful Types | Matt Pocock | 21m |
Live coding demonstrates concrete TypeScript helpers: shows that JSX nodes are react.JSX.Element but renderable values use react.ReactNode, explains why… | ||
| Deconstructing Distributed Tracing | Lazar Nikolov | link |
Distributed tracing is a powerful technique that allows you to track the flow and timing of requests as they navigate through a system. By linking operations… | ||
| Local-first Apps with ElectricSQL and React | James Arthur | link |
Local-first is a new paradigm for developing apps with instant reactivity, realtime multi-user and conflict-free offline built in. This talk shows how to… | ||
| AI in Frontend | Jesse Hall, Cristobal Chao, Joban Singh, Sanket Sahu, Christian Stuff, Daniel Espino García, Raymond Luong, Mukul Ramchandani, Rashmi Nagpal, Islem Maboud | |
This talk discusses the challenges of scaling and maintaining applications and how architecture decisions can impact them. It introduces the concept of… | ||
| OpenAI in React: Integrating GPT-4 with Your React Application | Jesse Hall | link |
In this talk, attendees will learn how to integrate OpenAI's GPT-4 language model into their React applications, exploring practical use cases and… | ||
| Virtual DOM: Back in Block | Aiden Bai | link |
Is the Virtual DOM pure overhead? In this tech talk, Aiden Bai explores the performance implications of the Virtual DOM in frameworks like React and presents… | ||
| Accelerating Design & Development Innovation with AI-driven Tools | Cristobal Chao | link |
Designers and developers work on different timelines—designers look to the future while developers build from what’s already been designed. They speak… | ||
| React(ing) to WebRTC: Build Better Audio and Video Experiences with Daily React | Christian Stuff | link |
What is WebRTC (Web Real-Time Communication), its main challenges, and how does the combination of React + Daily solve for them? We'll take a deep dive into… | ||
| Config Driven UI using ReactJS | Joban Singh | link |
We at Microsoft are rethinking the way we use ReactJS as frontend devs, traditional React UI Design patterns results in redundant code, making code… | ||
| Web Performance | Josh Goldberg, Mike Hartington, Medhat Dawoud, Lazar Nikolov, Daniel Espino García, Raymond Luong, Mukul Ramchandani | |
WebAssembly is a binary instruction format for a stack-based virtual machine, enabling deployment of code in languages like Go, Rust, or C++ to run in the… | ||
| How the Shadow DOM has Got You Covered? | Mukul Ramchandani | link |
We learn about possibilities of what DOM can do but have you ever wondered what all possibilities Shadow DOM can have. Well, In this talk I will help you… | ||
| Let's build a TV Spatial Navigation | Sergio Avalos | link |
In this talk, I'll take you through my journey as I joined the team supporting our Smart TVs application and share my experience learning one of the most… | ||
| Applying Product Thinking Principles to your Design System | Raymond Luong | link |
You've planted the seeds of your design system. Maybe you've built out a few components and set up a basic Storybook. But where do you go from here? It can be… | ||
| How to Improve Your Web Application's Security Using Mozilla Observatory | Karan Kiri | link |
In today's digital landscape, web application security is of paramount importance to protect sensitive user data and maintain user trust. The Mozilla… | ||
| WordPress-like Plugins, but for Next.js | Sanket Sahu | link |
Join me on my journey of creating the Next.js WordPress-like Plugin System, an experiment that enhances Next.js applications by allowing easy installation and… | ||
| How Much RAM Is Your UseMemo Using? Let’s Profile It! | Giulio Zausa | link |
Memoize all the things!, is what most React guides will tell you, explaining how its memory cost is negligible compared to its performance benefits, but has… | ||
| Career Advice & Soft Skills | Josh Goldberg, Theodore Vorillas, Daniel Espino García, Raymond Luong, Carmen Huidobro, Petar Ivanov | |
-- no description -- | ||
| Mastering Mobile DevOps: Leveraging React Native for High Performance | Cyril Bonaccini | link |
In the dynamic realm of software development, successful industry leaders share a common proficiency in four pivotal metrics: Deployment Frequency, Lead Time… | ||
| Build Intelligence at the Edge - Machine Learning with React Native | Rashmi Nagpal | link |
Have you ever wondered if we can really build machine learning models in React, rather than in the mainstream languages like Python or R? Afterall, React is… | ||
| To App or Not: When to Choose Native or Web | Mike Hartington | link |
In today's landscape, deciding between building a native app or a web app can significantly impact your project's success and user experience. As technology… | ||
| Understanding Rendering Patterns | Atila Fassina | link |
React has exploded in popularity thanks to the performance and unrivaled developer experience the virtual DOM and reconciliation could offer. But as our apps… | ||
| The Future of Web Storage: Exploring Advanced Storage APIs | Shubham Gautam | link |
Are you tired of relying on outdated web storage techniques? Join us as we explore the latest advancements in web storage and data management that will… | ||
| Building a Better Micro-Frontend Framework That Enables Platform Freedom | Saravana Balaji Srinivasan | link |
A modern tooling experience usually involves a user journey on multiple mediums, including Web, VS Code, GitHub, etc. Writing custom code and components for… | ||
| SOLIDify Your React Code | Islem Maboud | link |
Writing a cleaner Code in React by following SOLID Principles | ||
| Hacking JSX: Building in Minecraft with React | Felix Wotschofsky | link |
When combined with a custom rendering function, JSX can be used to quickly build a custom domain-specific markup language. I will show you how to approach this… | ||
| Frontend Architecture | Josh Goldberg, Saravana Balaji Srinivasan, Jan Demmerle, Sanket Sahu, Atila Fassina, Christian Stuff, Daniel Espino García, Raymond Luong, Carmen Huidobro, Petar Ivanov | |
-- no description -- | ||
| Daily Brush for Website Speed: Embrace the Performance Budget Ritual | Medhat Dawoud | link |
In this talk I will use the dental metaphor in order to introduce the performance budgets just like brushing teeth everyday to keep them clean and healthy you… | ||
| How Do We Use React Native at Mattermost. Architecture and Design | Daniel Espino García | link |
At Mattermost we use React Native for our app. It is a fairly complex project with more than 100.000 lines of code, with plenty of challenges, like… | ||
| CSS Only* Search: Improve React Filtering Performance with CSS! | Evyatar Alush | link |
Working on emoji-picker-react I encountered a challenge - filtering the list of 1800 emojis triggered a significant delay due to re-renders. Let's learn how I… | ||
| WebAssembly and React: A New Era of High-Performance Web Applications | Carmen Huidobro | link |
Hold on, WebAssembly on the server?! I thought it was for browser! In this talk, we'll explore the benefits of using low-level languages on the server-side… | ||
| Type System React | Josh Goldberg | link |
TypeScript's type system is incredibly powerful. It can represent bizarrely complex interdependent JavaScript types and comes with a Turing-complete set of… | ||
| Managing React State: 10 Years of Lessons Learned | Cory House | 17m |
Clear, actionable claims and code demos: unify related state with an address object instead of separate useState calls, when to replace multiple setters with… | ||
| Next.js for React.js Developers | Adrian Hajdin | link |
The workshop covers advanced topics related to Next.js and React, including React Server Components and their benefits, using React Server Components with… | ||
| React Server Components Unleashed: A Deep Dive into Next-Gen Web Development | Maurice de Beijer | link |
React Server Components allow for server-side rendering and improve performance by reducing the code sent to the browser. They enable asynchronous operations… | ||
| Authentication Beyond Passwords | Juan Cruz Martinez | link |
This workshop focuses on the future of authentication, specifically passwordless authentication. It explores the challenges with passwords and introduces… | ||
| Building AI Applications for the Web | Roy Derks | link |
This workshop focuses on AI for front-end developers and building with Lengtchain JS. Participants will learn how to create a custom MyGPT application, explore… | ||
| Crash course into Astro and Storyblok | Arisa Fukuzaki | link |
This workshop introduces Astro Storyblok and combines it with the headless CMS, Storyblok. It covers topics such as headless CMS, JAMstack, and the use of… | ||
| What's New in Redux Toolkit 2.0 | Mark Erikson | link |
Mark Erickson discusses the new features in Redux Toolkit 2.0, including the simplification of Redux logic and the addition of RTK query for data fetching. He… | ||
| Let AI Be Your Docs | Jesse Hall | link |
AI is a revolutionary change that helps businesses solve real problems and increase productivity. The workshop covers the demand for intelligent apps… | ||
| How to Automatically Consume APIs with React | Theodore Vorillas | link |
This talk covers the challenges of developing APIs and the available tools to simplify the process. It also demonstrates building a pizza menu application… | ||
| Building a Digital Sommelier on Top of ChatGPT and the OpenAI API | Jan Demmerle | link |
This talk introduces the concept of building a digital AI-powered sommelier using the Bracel.ai SDK. The speaker emphasizes the role of developers in shaping… | ||
| A Nerdy Guide to the Web Trending Concepts | Daniel Afonso | link |
Going to conferences can be overwhelming, so the speaker created a guide to trending web concepts using comic book characters. The chosen topic is… | ||
| Escape Security Flaws | Henrik Fricke | link |
The talk discusses web security and the importance of strong code protection. It highlights a vulnerability where a weak five-digit numeric code was used… | ||
| nothing matches | ||