Name: React Summit 2025
Start: 2025-06-13T11:00:00.000Z
End: 2025-06-17T19:00:00.000Z

Our Own React Global State Manager in Less Than 50 Lines of Code

Miguel Ángel Durán

Panel Discussion: The State of React

Tanner Linsley

Naman Goel

Evan Bacon

Shruti Kapoor

Mark Erikson

Jarred Sumner

Sacha Greif

Building Full Stack React Apps with Bun

AI tools are changing how we design, build, and test user interfaces. This talk looks at current AI technologies that are improving the frontend development process and how to use them, including:- Using Visual Copilot to convert Figma designs into production-ready code;- Implementing AI agents for automated code writing and testing;- Real-world examples showing how AI tools can improve development speed and joy.

AI-Powered Frontend Development: Building Better UIs Faster

Steve Sewell

SPA to SSR and Everything in Between

In this workshop, we'll go beyond the fundamentals and explore some of the more powerful features React Query has to offer. You'll gain a deeper understanding of how it works under the hood and learn how to write scalable, maintainable React Query code.Together, we'll build a simple example app and incrementally enhance it with one core objective in mind: delivering the best possible user experience. That means snappy interactions, minimal layout shifts, and avoiding unnecessary loading spinners wherever we can.To achieve this, we'll dive into advanced techniques like various forms of prefetching (including integration with route loaders), seeding the query cache, crafting smooth paginated experiences, and even persisting query state through full page reloads using persistence plugins. Note: You should have prior knowledge about React Query if you attend this workshop.

React Query - Beyond the Basics

Dominik Dorfmeister

Thanks to Expo Router it's easier than ever to build a beautiful app that runs on iOS, Android, and web. With the addition of AI tooling, it's now easier to build an app than it is to deploy one, but it doesn't have to be. Learn about how we've improved Expo Router and how we're making it easier to ship apps everywhere.

Deploy Everywhere with Expo Router

Join Evan Bacon, Xuan Huang, Mike Grabowski and Kræn Hansen in an engaging discussion room where we explore a Future of Native. This is the perfect space for you to share your insights and connect with like-minded individuals. Come and be part of lively conversations, ask questions, and expand your knowledge.

Discussion: Future of Native

Rita Castro

Kræn Hansen

Mike Grabowski

Xuan Huang

React Compiler was introduced back in 2024 as a way to automatically handle performance optimizations in your apps—but how does it work? In this talk, I’ll walk you through some of React Compiler’s internals. We’ll explore its full process, from parsing to Abstract Syntax Tree (AST) transformation, along with its key technologies, benefits, trade-offs, and a practical example of how it transforms your code to prevent unnecessary re-renders.The good news: you (luckily) don’t need to master its internals to integrate it into your codebase. That said, a solid grasp of its internals will significantly enhance your ability to apply the optimization techniques it unlocks!

React Compiler Internals

Lydia Hallie

At JavaScript Mastery, we've built a scalable learning platform to serve millions of developers worldwide—and the process came with its own unique challenges and takeaways. Traditional learning platforms suffer from rigid structures, low retention, and scalability bottlenecks, so we set out to create a flexible, high-performance system that could grow with our audience.In this talk, I'll break down how we engineered a dynamic MDX-based content system with React, enabling seamless integration of videos, interactive coding, and AI-powered quizzes.I’ll dive into:<ul><li>React Server Components &amp; streaming rendering for a 40% performance boost</li><li>Next.js-driven SEO strategies that tripled organic traffic</li><li>Data-driven engagement techniques that significantly improved retention</li><li>Scaling lessons from serving a global developer audience</li></ul>This is a real-world case study of the engineering decisions, challenges, and optimizations that took our platform from an idea to a widely adopted learning ecosystem. Whether you're scaling an LMS or any content-driven application, these insights will help you build, optimize, and grow your own platforms effectively."

From Architecture to Adoption: Engineering & Scaling a Modern LMS with React

Adrian Hajdin

<a href="https://en.wikipedia.org/wiki/Unconference">Unconference</a> is a format when participants pitch (=write on white board) ideas for short talks/discussions at the beginning of it, and then everyone gets an opportunity to get 5-7 minutes on "stage" and have a talk on the topic pitched earlier.Join Tejas Kumar, Adrian Hajdin, Naman Goel and others to discuss all things AI. Don't miss out on this opportunity to engage and learn together!

AI Unconference

Tejas Kumar

Johannes Goslar

In this talk, we will explore how to offload work to large language models and automate away most "busy work" in order to maximize and enhance productivity on a daily basis. We will do so mainly by exploring how LLMs can callfunctions.

Maximize Productivity with AI Agents

The State of React and the Community in 2025

How to Become a Staff Engineer

The State of React

Performance optimization is critical to delivering fast and seamless user experiences in the ever-evolving web development landscape. This talk delves into the innovative use of speculation rules to enhance web loading times and overall performance. Attendees will gain insights into the principles and mechanisms behind speculation rules, learn how they predict and pre-fetch resources, and explore real-world applications and case studies demonstrating their impact. Join me to discover how speculation rules advance the limits of web performance optimization and how you can implement these techniques to create faster, more efficient web applications.

Blazing Fast Page Navigation with Speculation Rules

Medhat Dawoud

You got here because you're amazing at technology, writing code, and getting things done. You grew your career by growing your skills. Now your technical chops are a baseline default. Learning a new library or framework or programming language won't do squat for your career anymore. You need something else.

Senior Isn't About Your Tech Skills

Swizec Teller

Lynx, a new cross-platform stack adopted by the TikTok app that empowers teams to ship truly native UIs to mobile and web from a single codebase using their existing web skills like CSS and React, has recently been open sourced.In this talk, we'll explore what makes Lynx familiar and what sets it apart from other cross-platform technologies; we’ll take a closer look at its dual-threaded design, and how that enables Lynx's instant launches and silky-smooth interactions, plus a sneak peak at what's next for Lynx.

Lynx: Unlock Native for More

Module Federation lets you organize code into federated modules, dynamically loaded at runtime within a host application—a core mechanism behind Super Apps. On the web, this is typically handled with Webpack.Now, with Re.Pack as a Metro alternative, React Native supports it too. This allows existing native Super Apps to transition to React Native and enables truly cross-platform modules, letting developers use React and JavaScript without concern for where modules run.In this talk, we’ll explore these possibilities, best practices and real-world examples to help you build efficient, cross-platform Super Apps.

Building Cross-Platform Federated Modules With React, React Native and Re.Pack

Remember when software architecture seemed like just boxes and arrows on a whiteboard? In this talk, we'll challenge that view and explore what really matters in modern software design. You will discover how successful architects think beyond tech specs, seeing architecture as a living story shaped by people, teams, and evolving needs. You'll gain fresh perspectives on building systems that last and learn why the best architectures are more about enabling people than enforcing technical decisions. Join me for a journey that might just change how you think about architecture forever.

Thinking Like an Architect

Luca Mezzalira

In the past few years, there have been a large number of generative AI use cases and adoption has grown increasingly. A large number of web and JS applications now leverage large language models (LLMs), vector search / RAG (Retrieval Augmented Generation) for building better user experiences. Now the tide is shifting, and we have entered the era of AI agents. This is a promising field which combines the different generative AI usecases and helps to simplify the process of interacting with Gen AI by essentially making agents act like humans and makes interactions feel more human like to solve problems in an automated fashion.In this workshop, while we give a quick over view of LLMs, RAG, we will dive deeper into concepts of AI Agents such has how one can leverage LLMs for specific tasks. How can we include tool calling / function calling in AI Agents. Thus showing how an AI Agent is a system that is capable of independently deciding which functions or data sources to used to efficiently execute users' orders.We will show how to develop an AI agent that runs purely on the browser vs running them using cloud.  This workshop is for javaScript developers, AI enthusiasts, and tech innovators who want to integrate the use of AI within web applications to create intelligent and interactive app experiences. Table of contents:  1. Intro to the general landscape of LLMs, RAG2. What are AI Agents3. Core components of AI Agents4. How to build your first AI Agent with JavaScript5. Stack to build AI Agents in the browser with open source models

Bringing and Running AI Agents in the Browser

Shivay Lamba

In this workshop I’ll cover a repeatable process on how to spin up full stack apps in Cursor.  Expect to understand techniques such as using GPT to create product requirements, database schemas, roadmaps and using those in notes to generate checklists to guide app development.  We will dive further in on how to fix hallucinations/ errors that occur, useful prompts to make your app look and feel modern, approaches to get every layer wired up and more!  By the end expect to be able to run your own AI generated full stack app on your machine!

Building Full Stack Apps With Cursor

Mike Mikula

Join Elio for a talk on mastering live coding demos. Learn to script your demos for seamless, error-free execution using Visual Studio Code and the Demo Time extension. Ideal for anyone performing live coding at conferences, webinars, or team meetings, this session will help transform your presentations from stressful to impressive.

Improve Your Presentation Skills by Scripting Your Live Coding Demos to Perfection

Elio Struyf

In this workshop we'll dive into the latest advancements in React and best practices for building modern React apps. We'll take a look at modern NextJS and React Router 7 Framework (aka Remix) along with React's new "React Server Components". We'll also talk about improving the data-fetching strategies of your SPAs along with options for migrating your SPA to modern React Router.

Modern React Architecture

Brad Westfall

Tired of bending your deployment process to fit Next.js? With the power of adapters, you can now deploy your app seamlessly to a variety of platforms—from the cloud to your local dev cave. In this talk, we’ll explore how adapters simplify the deployment pipeline and make Next.js feel right at home, no matter where it’s hosted.

Next.js Adapters: Build Once, Deploy Everywhere

JJ Kasper

In this session, I will discuss how React can be a powerful tool for creating applications that are not only scalable and secure but also inclusive and impactful in emerging markets. Drawing from real-world examples, such as Sunga, a financial platform designed for the Malawian market, and Chip In Agriculture, a project that connects farmers with buyers, I will demonstrate how React’s flexibility and efficiency can drive innovation in sectors like agriculture and finance. Participants will gain valuable insights on building applications that prioritize accessibility, security, and community empowerment, and leave with actionable knowledge on how to apply these principles in their own projects to make a meaningful difference in underserved regions.

React for Good: Creating Inclusive, Secure, and Scalable Applications in Emerging Markets

Innocencia Ndembera

Choosing the best framework is tough, isn't it? We've got Next.js, Remix, and a bunch of others thrown into the mix. So, let's keep it real in this talk—I'll be comparing three of the big contenders: Next.js, Remix, and one surprise package.We'll be looking at some key stuff like Data fetching, Routing, SEO, Performance, Server-side Rendering, and more. Think of it like a friendly showdown where these frameworks go head-to-head in a fair and square matchup.We'll dish out points and see who comes out on top, highlighting which framework rocks for different uses and helping you out with your next project. And hey, no favoritism here—I'll be keeping it neutral and backing it all up with real-world examples.

Let's Fight: React Framework Showdown 🥊

Ankita Kulkarni

React and its ecosystem grows every year. New tools, new patterns, new concepts. This workshop covers the latest trends in the React development world. If you feel that you know how to use it but there is something more you could learn, this workshop is for you. We'll be going through the fundamentals, composition patterns, state management, styling workflows, routing, server-side rendering and components.

React in Patterns

Krasimir Tsonev

Use React principles beyond React projects! Come to this talk to learn how to apply componentization, declarative programming, and reusability to general front-end JavaScript tasks. Elevate your skills and create scalable, maintainable codebases irrespective of the framework or library you choose.

Using React Without Using React

Building real-time multiplayer games in React Native presents unique architectural challenges. Through the lens of a reflex-testing game, this talk demonstrates practical solutions for state management, routing, and real-time synchronization. Developers will learn battle-tested patterns for handling complex game states and implementing responsive multiplayer features.

Real-Time Multiplayer Gaming with React Native: A Reflex Game Case Study

Harshil Agrawal

AI-powered development tools are excellent for helping us deliver code more quickly. However, based on my extensive experience in test automation and identity management, I've noticed that these tools can also introduce subtle security issues that might even impress Skynet. In this session, I will discuss real-world examples where AI assistants have inadvertently worked against developers, highlighting cases of data leaks, supply chain attacks, and prompt injection vulnerabilities. You will learn effective strategies to identify AI-generated security issues before they impact you. After all, if Skynet ever awakens, let's ensure it isn't due to an untested AI-generated function that set it off.

The AI Developer's Guide to Not Accidentally Summoning Skynet

Ramona Schwering

Can we apply the lessons of CSS to JavaScript?While working on StyleX we use compilation and the technique Atomic CSS to create a more efficient system. Having small atomic CSS rules maximizes re-usability and dramatically reduces the size of the CSS at scale. A powerful compiler, makes the process automatic and frees from having to think custom DSLs. Can we do the same for JavaScript? What would the trade-offs be? Can it result in unique benefits not possible with most other approaches?

Compiled Atomic JavaScript?

Most software projects fail, but shipping fast improves your chances of success. That’s why focusing on iteration velocity is so important and you should design your application architecture accordingly. Full stack frameworks like Next and Remix give you full control over the web experience with access to a dedicated web server. With Next and Remix, you expose custom endpoints for your UI (server actions, Remix actions and loaders) and use special-purpose payloads (e.g., via RSC or turbo-stream) tailored for the web frontend. But what if you need to add another frontend to your project? With LLM applications growing in popularity and the Model Context Protocol (MCP) gaining adoption, it’s becoming more likely that you’ll need to serve both third-party LLM applications and your existing frontend app. How can we best serve LLM apps with our existing full stack architecture? Let’s talk Backend for Frontend, full stack app architectures, and MCP!

Your Frontend’s Best Friend - How to Ship Fast in 2025

Andre Landgraf

Website performance significantly impacts user experience, often leading to frustration and anger when pages are slow or unresponsive. Beyond psychological effects, poor performance can increase usage costs and modern websites require a nuanced approach to capture continuous user interactions.This session explores behaviors like rage clicks and cursor thrashing, emphasizing metrics that reflect user emotions and overall satisfaction. We'll discuss the complexities of performance measurement, highlighting the need to look beyond single metrics. Ideal for those interested in understanding the business impact of site performance and the biases affecting user perceptions.

Web Performance Meets Human Sciences

Matheus Albuquerque

Unlock the Power of Modern Full-Stack Development in Half a Day!Ready to build lightning-fast, scalable web applications? Join our immersive 4-hour interactive workshop and dive headfirst into the world of Full-Stack Next.js 15!This isn't just another theory session. You'll roll up your sleeves and build a real-world movie comparison application from scratch, guided step-by-step by our expert instructor Maurice. We'll start by setting up your local development environment with a robust PostgreSQL database running in a Docker container. Then, you'll experience the magic of rapid UI generation using <a href="https://v0.dev/">v0.dev</a>, allowing you to create stunning interfaces with ease.But we won't stop at the front-end. You'll learn how to seamlessly integrate your UI with a powerful backend using Next.js 15's latest features and the elegant Prisma ORM to interact with your PostgreSQL database. Plus, you'll discover the best practices for handling client-side behavior with a fun, interactive movie comparison feature.Finally, we'll take your application live with continuous deployment to Vercel, showcasing how to effortlessly share your creations with the world. By the end of this workshop, you'll have a fully functional movie comparison app and the confidence to tackle your own full-stack projects using the cutting-edge Next.js 15 ecosystem.

Full-stack App in half a Day: Next.js 15 Development Bootcamp

Maurice de Beijer

Malicious code is out to get you. Can you keep your app working as expected and hold on to your secrets? Come to this workshop and try!The entire workshop will be delivered as bite-sized hands-on exercises where increasingly advanced threats are presented and you get to defend.  No matter if you're concerned with malicious npm packages or building software to run other people's code, techniques presented in this workshop can be used to isolate JavaScript at runtime and protect against prototype poisoning. We'll explore techniques allowing cooperation with packages that intend to steal your secrets and mess with built-in functionality of JavaScript via prototype-poisoning.Another part of the workshop will focus on using tools to isolate code and scale the defensive coding practice up for larger codebases. If you're not dealing with security-critical code, it's a great opportunity to expand your awareness of rarely explored areas of JavaScript knowledge.

Defensive Coding

Zbyszek Tenerowicz

Starting a startup is one thing - scaling it is another beast entirely. In this practical, experience-driven talk, I'll take you through our two-year journey of building and scaling a JavaScript application from ground zero. Rather than theoretical concepts, you'll hear real stories about the technical challenges we faced and the solutions we implemented.

Scaling a React Application from 0 to a Brazilian Users

Neciu Dan

Server Components is a new pattern for the JavaScript world, but in this lightning talk, you'll see how easy it is to understand if we compare it to another old web language, one that shaped web development as we know it: PHP!

Server Components Wars: PHP Strikes Back

Edoardo Dusi

It’s now easier than ever to build and maintain Rust libraries for React Native - and I’ll show you how.I want to tell you the story of how we got here in the first place, motivate the benefits of Rust libraries in React Native, explain the difficulties of interoperating across native languages and show how the introduction of the NAPI binding in Hermes and the new Ferric build tool, brings the missing pieces for automatically generating performant type-safe prebuilt bindings of Rust libraries.My ultimate goal of this talk is to inspire you to build with Rust in your next React Native project.

Rusty Native Modules for React Native

Join us as we journey from React frontend development to fullstack development with Next.js. During this workshop, we'll follow along the official Next.js Learn tutorial with Eric Burel, professional trainer and author of NextPatterns.dev. Together, we'll set up a Next.js website and explore its server-side features to build performant apps.

The Journey From React Frontend to Fullstack Development With Next.js

Eric Burel

Unlock the potential of geospatial data by combining React and deck.gl to create immersive web applications. This talk will demonstrate how to transform complex datasets into interactive, high-performance visualizations that captivate users. Whether you’re working on urban planning, environmental monitoring, or storytelling, learn how to elevate your projects with cutting-edge mapping technologies.

Beyond Maps: Crafting Immersive Geospatial Experiences with React and deck.gl

Marko Letic

This talk introduces you to unconventional places where React can be rendered to solve problems outside the the boundaries of your browser window. It speciically dives into Productivity Plugins and Embedded Systems.

React Beyond the Browser

Menahi Shayan

Animation often sits in between design and dev. Sometimes a passionate designer will include animation guides into their Figma designs. If they don't, sometimes a passionate dev will take the initiative and throw in an animation of their own. Let's talk about how to make animation a first class citizen and include it in your design process.In this talk I'll cover some animation basics, WHY you should consider animation, examples of EFFECTIVE animations vs DISTRACTING animations, some WARNINGs about animations, the different TYPES of animation (css vs js, springs vs time based) and MORE!

Whose Job is Animation?

Matt Colman

Metaframeworks: you're probably using one already and may or may not love the experience - but what if I told you they aren’t rocket science?In this talk, we’re ditching the buzzwords and over-complication to build one from scratch—yes, you heard that right.Armed with Vite, Vinxi, Nitro, a pinch of vanilla JavaScript, and a healthy dose of curiosity, we’ll piece together the routing, rendering, and all the essentials you’ve been letting metaframeworks handle for you.Expect aa crash course in understanding the tech you use every day. By the end, you might just be asking: Should I just roll one myself? Aand no, you shouldn't. But it's sure fun building one and understanding what makes them tick, no?

Build a Metaframework in 30 Minutes or Less

Darko Bozhinovski

TiKevin83 details how he used next.js and webassembly (WASM) to port a speedrun-accurate Game Boy emulator onto the web. Topics include using emscripten to compile a C library into a WASM module, interfacing with a WASM module from a Next.js site, video and audio playback onto the canvas and audio APIs from a WASM module, and nuances of web control schemes especially in implementing multi-touch input.

T3Boy: Making Accurate Game Boy Emulation Accessible with Next.js and WASM

Travis McGeehan

Video is the most powerful and engaging content format currently on the web. With mobile-first experiences becoming the norm, users expect high-quality, smooth video playback, whether they're watching on a fast Wi-Fi connection or a spotty mobile network.However, delivering optimized video content is not easy. Challenges like adaptive streaming, efficient compression, fast loading times, and responsive playback make it tricky to balance quality and performance. This lightning talk will focus on implementing adaptive bitrate streaming in ReactJS to ensure videos play seamlessly on mobile and on-the-fly thumbnail generation to enhance user experience—all with minimal setup! 🚀

Delivering High-Quality Videos on Your ReactJS Website

Rahul Nanwani

Discover how modern form validation techniques are revolutionizing React development. This talk explores the transition from traditional methods to innovative, unit testing-inspired frameworks that streamline validation logic. Learn how to leverage declarative syntax and framework-agnostic solutions to enhance user experience and maintainability in your React applications. Gain practical insights into managing state and asynchronous validations for robust and scalable solutions.

Validating the Web: The Evolution of Form Validation

Luis Oliveira

As our React applications grow, so do the challenges of maintaining bug-free code. Crafting a reliable test suite can be a daunting task, often plagued by flakiness and complexity. In this talk, I’ll break down a practical, engineering-first approach to writing tests that actually make development smoother. We’ll dive into the best ways to integrate Playwright with React, ditch outdated testing mindsets, and adopt strategies that ensure your app works as expected—without the headaches. Expect real-world examples, actionable takeaways, and a fresh perspective on testing that might just make you enjoy it.

Testing React Applications Like an Engineer

Austin Shelby

An enthusiastic look at some real-life horror stories of accessibility gone wrong. Learn accessibility best practices by examining cases where some people (myself included) built the right things the wrong way. Some customers were simply confused, while others literally became nauseous of what was built. Come learn from (my) mistakes while having a good laugh.

My Heart Is in the Right Place, but the Dom Isn’t

Kyle West

My Heart Is In the Right Place, but the DOM Isn't

It's been several months since the release of React Compiler Beta, but for some reason there are hardly any talks describing this tool in all depth.I mean, what are those dozens of tabs on the React Compiler Playground website? How does those 30+ environment flags work? And most importantly, can it affect my React website in production and can I benefit from utilizing all of these settings and tools?Let's dive deep (and I mean really deep) into the React Compiler source code and see how flexible this tool is and what are the challenges of working with it?

How to React Compiler

Anton Nepsha

Node-based user interfaces offer an intuitive and powerful way to represent complex data flows and processes. In this interactive 3-hour workshop, you’ll learn how to create engaging diagram UIs using React and the popular React Flow library. We’ll start by exploring key libraries for creating custom diagram UIs, comparing their strengths, differences, and most effective use cases. Focusing on React Flow, we’ll then build a workflow application together, introducing features such as custom nodes and edges, drag-and-drop functionality, state management, minimap and zoom controls, auto- layout, and property-editing sidebar. You’ll discover how to leverage open-source UI components designed for diagramming to enhance visual appeal and learn how to extend diagrams with custom functionality. We’ll also look at existing tools and products that can streamline your development process – so you can concentrate on implementing your business logic efficiently. By the end of this workshop, you’ll know how to unlock the potential of node-based UIs in React, enabling you to create rich, interactive applications tailored precisely to your project’s needs.Workshop Agenda:<ul><li>Introduction to Diagram Libraries</li><li>Building a Workflow Application with React Flow</li><li>Implementing Advanced Interaction and Usability Features</li><li>Enhancing the User Experience</li><li>Extending and Scaling Your Node-based UI</li></ul>Please note that this workshop assumes a comfortable working knowledge of React, so we can focus on building advanced features right from the start.

Build and Customize a Node-Based Workflow Builder With React

Łukasz Jaźwa

Coding assistants are already changing the way we develop code, and in several years they are expected to completely change how developers interact with code and write it. In this workshop, I'll share tips and best practices on using such tools as we develop the production-ready app with Zencoder.

Developing Production-Ready Apps in Collaboration With AI Agents

Alex Shershebnev

Unlock the full potential of modern web applications with multi-threaded architectures in React. This session explores strategies for leveraging Web Workers and OffscreenCanvas to parallelise data processing, heavy computations, and UI rendering. We'll discover how to create interfaces that are scalable and unrestricted by conventional JavaScript bottlenecks.

Scaling React Apps with Parallelism: Patterns for Multi-Threaded UIs

Shubham Gautam

Discover how we tackled the common challenges of a large E2E test suite and made our React codebase easier to refactor.In the past year, we went from zero to 20,000 lines of Playwright tests, pushing its capabilities beyond basic end-to-end testing. This talk will explore the challenges we encountered as we scaled our Playwright setup and how we solved them, thanks to the robust ecosystem and team creativity.The talk covers:- Testing approaches and where common tools fit on the testing pyramid- Challenges scaling E2E test suites: performance, flakiness, ownership, mocking and more- How we solved these challenges to unblock refactoring a large React codebase- Advanced Playwright tips and tricks

At the Top of the Pyramid: Playwright Testing at Scale

Kate Marshalkina

As applications scale in complexity, managing user permissions becomes a growing challenge. Without a structured approach, permissions quickly become a tangled mess of if-else statements, leading to poor maintainability and scalability. While Role-Based Access Control (RBAC) provides a strong starting point for managing user access, it may not offer the level of granularity needed as your app evolves. To gain finer control over who can perform what actions, on which objects, and under what conditions, the Attribute-Based Access Control (ABAC) model, recommended by OWASP, becomes invaluable. In this session, we’ll explore two practical approaches to building a scalable permissions system in React. First, I'll introduce CASL, a popular ABAC library that simplifies fine-grained access control. Then, I'll walk you through creating a custom permissions system from scratch, offering insight into designing a solution that fits your app’s needs. Throughout the session, I'll conduct detailed code walkthroughs for both approaches, covering key concepts like optimized state management, custom hooks, and caching/conditional queries using Redux Toolkit. You’ll learn how to implement these strategies to create a clean, efficient, and maintainable permissions framework. By the end of the session, you’ll have a solid understanding of how to implement scalable permission systems in React, whether you choose a pre-built solution like CASL or build your own.

Security meets Usability: Crafting Dynamic and Granular Access Control Solutions

Samhitha Rama Prasad

What if the architecture of our web applications wasn't solely about technological choices? Many backend architecture practices could be relevant in the frontend but remain underutilized. These practices capitalize on how our brain functions to enhance efficiency. Since we spend over 70% of our time reading code, developing the ability to read more efficiently, achievable through solid architecture practices, would be advantageous.

Prioritizing Architecture Over Framework in Web Development

Alexandre Rivest

This talk explores the architectural implications for frontend development in serverless applications. I’ll examine how the stateless, on-demand nature of serverless backends requires frontend developers to adopt new patterns and strategies. We’ll discuss how architectural decisions around distributed state management, connection handling techniques to mitigate cold starts, designing better loading experiences, implementing robust error boundaries, and adapting authentication logic impact the frontend architecture in serverless environments. The presentation includes live demonstrations of real-world implementations, such as a real-time SSE dashboard, JWT authentication, and serverless image generation. Join me to discover how frontend architecture must evolve to complement modern serverless backends.

Reimagine Frontend in the Serverless Era

Evangelia (Litsa) Mitsopoulou

What if you never had to touch styles in your code again? This lightning talk presents a real-world approach to fully automated design implementation — where changes in Figma are automatically reflected in the app via tokens and a CI pipeline. A practical look at what happens when you give full visual control to designers, and why that might be a good thing for developers, too.Audience Takeaways:- A provocative perspective: does a frontend dev really need to write styles?- Tools and techniques to sync Figma → GitHub → CSS → Web app.- A rethink of responsibilities between designers and developers.

Zero-Styling Development: Utopia or the Future of Frontend?

Mateusz Jagodziński

See how far simple charts in React and SVG can take you, and where their limits start to surface. We'll explore the sweet spot of using React's declarative model with plain SVG elements and a touch of D3 for utility functions like scaling and path generation, before reaching the performance and complexity ceilings that call for something more robust.

Efficient Data Visualisation with React and SVG

 Ido Moshe

You just shipped a new feature. Tests passed. CI’s green. Everything’s deployed. Life’s good… until the alerts start rolling in. Users reporting “weird stuff happening”, UI glitches, vague “it seems slow” reports, and that dreaded “can’t login” message. Well, this is shaping up to be a bad day. But… maybe not.Watch this hands-on session to learn how to build it, break it, debug it, and go from “no idea what’s wrong” to fixing issues—all in one go. Since we’re serious developers (obviously), we’ll use Next.js and:<ul><li>Setup Sentry from the ground up - including Errors, Session Replay, and Tracing</li><li>Learn ways to use Replays to understand the real user experience, and how to use Tracing to debug application issues</li><li>Leverage Sentry AI and the context of your application to understand what’s actually broken, and use Autofix to generate a fix - from root cause all the way to PR.</li></ul>Use this workshop guide to follow along: <a href="https://sentry-build.vercel.app/quickstart/" target="_blank">Quickstart Guide</a>.

Instrument, Monitor, Fix: A Hands-On Debugging Session

Lazar Nikolov

<div>AG Grid and AG Charts are enterprise grid and chart libraries that are built for performance. In this workshop, you'll learn the basics of getting started with building feature-rich grids and charts in your React applications.</div><div> </div><div>You'll discover:</div><div><ul><li>How quick you can build powerful grid and charting solutions in React:</li><li>Rendering and editing cells in AG Grid</li><li>Building line, bar, and pie charts.</li></ul>In this 3 hours hands-on workshop you'll learn the powerful simplicity of using AG Grid and AG Charts in your apps. Let's be honest, grids and charts can be tough. Thankfully, AG Grid and AG Charts makes it easy. This workshop is helpful for those considering a grid to chart library, for developers, and for team leads.</div>

Building Dynamic Grids and Charts

Brian Love

Test and trust your React app by combining Playwright’s powerful browser automation with modern synthetic monitoring. In this hands-on workshop, you’ll learn how to write real user flow tests with Playwright, run them locally, and then scale them into production-ready monitoring with Checkly.We’ll start with a quick tour of synthetic vs. real user monitoring, then dive into testing key interactions in your app, from page loads to forms and navigation. You’ll learn how to use Playwright’s core features to create reliable end-to-end tests.Next, we’ll show you how to turn those local tests into live monitors. You’ll deploy your tests as synthetic monitors, view test runs, and debug failures with rich observability data, like screenshots and traces.Table of contents:<ol><li>Intro: Synthetic vs RUM, Testing vs Monitoring</li><li>Setup to run app locally</li><li>Write Playwright tests on the app</li><li>Playwright core features</li><li> Run tests</li><li>Convert Playwright tests into synthetic monitors</li><li>Concepts of Monitoring as Code</li><li>Observability: debug with Traces, Logs &amp; Screenshots</li><li>Closing the loop with alerts and notification channels considerations</li></ol>Workshop level: developers comfortable with React and CLI tools.

Enhancing React Apps with Playwright Monitoring

Nica Mellifera

Tests first, code last!How to develop your frontend that the code isn't falling apart? How to make it scary free to deliver your work results? How to battle bugs that are chasing you at every step you make?I am going to answer these questions during the workshop and show how to follow TDD at React applications.To showcase the approach I am going to use Cypress, React, MobX, and even Dev Containers. These tools can be replaced by others that are in use in your projects today. Here and now tooling is not so important.In spite of the title the workshop is going to be useful not only for frontend developers. You can benefit from it even working in a different area of development because the key here is a mindset of how to make reliable applications through testing.

TDD in Frontend

Aleksandr Shinkarev

React Summit

I am attending the biggest #Reactjs conference remotely. You may get a limited free ticket (50% of talks, no workshops) and join me by clicking this badge.

#react #reactjs

React Summit is an annual conference on all things React, gathering thousands of Front-end and Full-stack engineers from around the world.

React Summit 2025

The biggest React conference worldwide