Name: React Summit 2026
Start: 2026-06-11T22:00:00.000Z
End: 2026-06-15T22:00:00.000Z

Varun

Ciarán Curley

Lera

  Neha  Seth

Aleksei Podgaev

Seungho Park

Richard Carrigan

Rajni Gediya

Vasilii Boldurean

Jose Pablo Fernandez Guerra

David Barry

Jeroen van Wissen

David Pugh

Kirill Jegorov

Karyna Bunta

Petar Kuzmanov

Gerson Enriquez

Devan

Cvetanka Nechevska

Emerson Marini

Mangirdas Darguzis

Svetlana Smirnova

Ivan Almasi

João Cidade Silva

Alex Perez

Georges Chami

Sanketh Kumar

Pagal3

pagal

Keertivaas S

avan

Andrew Harasymiw

ahmed

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

Throughout history, empires rise and fall. Throughtout web development, frameworks rise and fall. In 2026, we are firmly in ""late stage React"", where young devs can't remember the world any other way, and older devs are keeping their eye on the horizon for what's next.What if I told you there was a TypeScript-first UI framework created by a member of both the React _and_ Svelte core teams focused on fine-grained reactivity and rendering speed that will look instantly familiar to you?I'd like to introduce you to Ripple, show you around its syntax and philosophy and stimulate your mind out of the Present and into the Future.

Ripple: the Good Parts of React, Svelte, and Solid

Erik Rasmussen

In this workshop, we will explore React's latest features: Server Components, Server Actions, and Forms. Gain insights into optimizing server-side rendering, enhancing application interactivity through Server Actions and React 19 hooks, and mastering form creation for robust data handling and validation. Designed for developers of all levels, this workshop provides practical skills to build scalable, performant web applications.

Hands-on React Server Components, Server Actions, and Forms

Aurora Scharff

While tools like Jest, Jasmine, Karma, and Testing Library  were always there when we needed them for testing our web apps, it's time to move on. In this talk, we'll revisit the battle scars they left behind, and explore how Vitest isn't just trendier — it's the result of hard-earned lessons in speed, reliability, and developer experience. You'll leave with: - A sense of closure for the old stack. - A tour of the modern features Vitest brings to the table. - Clarity on "Partial" vs. "Full" Browser Mode. - The anatomy of a maintainable test: Fakes, Object Mothers, and patterns that future-proof your specs. - A look at Testronaut — a testing companion that takes these patterns further. Come for the nostalgia. Stay for the clarity. Leave ready to cook.

Ashes to Ashes, Spec to Spec: The Rebirth of Modern Testing

Younes Jaaidi

Discover the power of Server Components in React without the need for a framework. In this workshop, we will explore how to build a server-side rendering solution using "only" vanilla JavaScript and Node.js. We'll dive into the core concepts of Server Components, including how to render components on the server and manage data fetching. By the end of this session, you'll have an understanding of how to implement Server Components in your own projects without relying on a framework.

From Zero to Streaming: Implementing React Server Components Yourself

Krasimir Tsonev

Should we be using a state management library to toggle dark mode? Do we really need a custom hook for opening an accordion? And how many event listeners is too many when animating on scroll? React gives us an incredibly powerful way to build UI, but not every UI behaviour needs React level machinery. In this talk, we’ll take a look at how to use HTML and CSS to build simpler alternatives to common interactive components such as accordions, modals, scroll transitions, carousels etc We’ll also take a look at the performance and accessibility benefits and real-life applications and use-cases of these components.  The goal is to simplify how we handle content, display and animation using native browser features and leaving React to do what it's best at: everything else.

Your React App Doesn't Need All That JavaScript

Jemima

FWD: Urgent Opportunity to Claim Your React + MDX Newsletter Inheritance

César Alberca

Direct the code. Don't just write it.The development landscape is shifting from manual coding to system orchestration. Whether you are a seasoned React engineer looking to 10x your output or a product-driven creator aiming to turn a prototype into a functional app, this workshop is your gateway to AI-native development.Join us for a hands-on, 4-hour masterclass where we build a feature-rich, fullstack application from scratch using Cursor Composer. We skip the boilerplate and focus on the exact workflows used to ship high-quality features in minutes, not days.What You’ll Master<ul><li>AI Orchestration: Move beyond simple autocomplete to manage multi-file changes and complex app logic.</li><li>The .cursorrules Framework: Learn how to enforce project standards and prevent AI "hallucinations" for consistent, professional code.</li><li>Rapid Fullstack Scaffolding: Generate type-safe database schemas and backend logic instantly.</li><li>High-Fidelity UI Iteration: Transform prompts into polished, responsive interfaces using modern CSS and component libraries.</li><li>Hardening &amp; Refactoring: Use AI to hunt bugs, clean up "spaghetti" code, and generate comprehensive test suites.</li></ul>The ProjectWe will build a modern, data-driven web application that demonstrates the power of AI-assisted development. By the end of the session, you will have a functional codebase that showcases complex data relationships, dynamic UI, and optimized state management. Who Is This For?Developers who want to eliminate repetitive tasks and focus on high-level architecture.Founders &amp; Prototypers who need to bridge the gap between an idea and a working product rapidly.Tech Enthusiasts eager to master the professional AI-native toolkit.Requirement: Bring a laptop with Cursor installed. We provide the roadmap; the AI provides the speed; you provide the vision. As this is a live online session, we encourage you to sign up ASAP to receive the pre-workshop setup guide and ensure you are ready to build from minute one.

Building Fullstack Apps with Cursor

Maurice de Beijer

Every modern app starts from the same truth: your website is built on data. Traditionally, developers define how that data turns into UI - the f in UI = f(data, state). But every user approaches your app with different goals, contexts, and focus, and a one-size-fits-all interface forces them to work around the UI instead of it working for them. In this talk, we’ll explore the Generative Front-End - a new paradigm where the logic that maps data to interface is itself generated by an LLM. We’ll see how React Server Components and Server Functions make this pattern possible natively, without hacks or ad-hoc APIs. The result: interfaces that adapt to the user, the data, and the moment - where developers design the system that builds the screens.

The UI That Builds Itself: Exploring the Generative Front-End

Kiril Peyanski

We will explore how attackers steal browser cookies and session data, even with modern protections in place. The session showcases real-world techniques used in post-exploitation to extract sensitive information. It highlights the need for developers and defenders to understand browser internals and encryption to stay ahead of threats.

Protecting Your Cookies from Hackers and Hungry Developers!

Mohamad Shiralizadeh

<div>Many front-end developers build modern applications with confidence, but struggle when it comes to shipping those applications to production. Docker, CI/CD, environment configuration, performance tuning, and deployment often remain “someone else’s job” — until something breaks and becomes your responsibility. This workshop closes that gap. It’s a practical, production-focused workshop designed for front-end developers who want to take full ownership of their front-end applications — from local development to stable, production-ready deployments. You’ll learn how to: </div><ul><li>Dockerize front-end applications for both development and production</li><li>Create optimized, production-ready Docker images for modern front-end frameworks</li><li>Optimize front-end applications for performance, stability, and reliability</li><li>Avoid common production mistakes seen in real-world front-end projects</li></ul>Docker for Front-end Developers is a practical book designed specifically for front-end engineers who want to truly understand and confidently use Docker in real-world projects — written by Docker Captain and author of the official Docker React.js sample documentation Kristiyan Velkov — with 30% off using code DOCKER30.

DevOps for Front-end Developers: From Local Code to Production by Docker Captain

Kristiyan Velkov

One of the exciting things about web development is that the underlying technology that we use is constantly evolving. It’s hard to believe, but Server Components, partial hydration and hybrid rendering are no longer experimental features and are here to stay. With more projects adopting these newer patterns for client side rendering, the challenge now is to ensure that these applications can scale and that there are not new performance and reliability challenges that have not yet been fully considered. We’ve begun to encounter a wide range of new issues that include hydration behavior that doesn’t work the same way every time, rendering waterfalls, delayed streams and more, as well as some of the more subjective performance regressions. So you’ve built this amazing React app, and now it’s time to deploy it to production. But what actually happens when you type in your username and password and hit submit? Let’s take a closer look and skip all the boring parts about React and focus on the low level details of what’s actually happening and how the browser turns your state into pixels on the screen. We’ll get into why hydration mismatches happen and how to figure out why they’re happening to you. And finally, we’ll look at some actual tools and techniques that you can use in your app to improve the user experience, squash weird rendering bugs and make hybrid rendering easier to understand and manage.

Real-World Hydration and Rendering Patterns in Modern React Apps

Raju Dandigam

How can you create performant animations, backed by fast-updating data, on the web, using React? Come learn how to make silky-smooth data-powered animations without having to give up the convenience of React. (Mostly…) React is great for manipulating the DOM, but all that shadow DOM logic can bog down data-powered animations and slow down sites. There’s a trick to getting it right (and, spoiler alert, some of it’s not React). We’ll go through a real-world case-study and along the way, learn about: - how to get data from the backend to your frontend mega-fast - why requestAnimationFrame beats setInterval hands down - the power of HTML Canvas for web-based animation Come see how fast React can be!

Gotta Go Fast: React at 60 FPS

Rachel Kaufman

Most React applications treat state as the single source of truth. But what happens when time itself lives outside React? While building a production multi-track timeline engine, we discovered that the Web Audio transport, not React state had to become the canonical timeline. In this talk, we will explore how we designed a channel-based audio graph and canvas-rendered editor around an external high-precision clock, enabling deterministic synchronization of externally generated audio and media, 60fps rendering, and zero-reload state updates without letting React’s reconciliation interfere with real-time guarantees.

React vs. Real-Time: Build Real-Time Features Without Fighting the Framework

Shubham Gautam

In this hands-on workshop, you’ll learn how to integrate AI directly into your application using TanStack AI. We’ll build a working AI chat feature end-to-end, starting from server setup and finishing with a streaming client, tool calling, human-in-the-loop workflows, and real debugging using TanStack DevTools. Through guided exercises, you’ll learn how to set up TanStack AI on the server, connect a client application to a streaming AI backend, build a functional chat interface, create your first AI tools, and implement approval flows so humans can stay in control when tools are invoked. By the end of the session, you’ll understand the core building blocks of AI-powered applications and walk away with a solid foundation for adding intelligent chat and tool capabilities to your own apps. Workshop outcomesWhen you're finished with this workshop you will:<ul><li>Understand how to set up TanStack AI on the server and wire it to a provider (like OpenAI)</li><li>Know how to connect a client app to a streaming AI endpoint and handle incremental updates cleanly</li><li>Build a functional chat UI with a solid state model for messages, streaming tokens, and tool results</li><li>Create and use your first AI tools with clear inputs, outputs, and predictable behavior</li><li>Build human-in-the-loop workflows with tool approvals so your app can ask for confirmation before executing sensitive actions</li><li>Debug and inspect your AI app using TanStack DevTools, including tool calls, responses, and streaming behavior</li></ul>What you'll learn TanStack AI gives you the primitives to build real AI features, not just a demo prompt box. This workshop focuses on wiring everything together properly, from server-side streaming to client UX, then layering in tools, approvals, and debugging so the final result is something you can confidently evolve into production features. You’ll learn the following through these exercises:<ul><li>Server setup - Configure TanStack AI on the server, connect to your model provider, and expose endpoints that support streaming chat</li><li>Streaming and SSE - Implement and consume streaming responses, understand the lifecycle of a stream, and build UI that stays responsive while tokens arrive</li><li>Chat UI and state - Build a chat interface that handles message history, partial responses, loading states, and tool outputs in a clean way</li><li>Tools - Define tools, validate inputs, return structured outputs, and integrate tool results back into the conversation flow</li><li>Human in the loop - Add approval steps for tool execution, implement “approve/deny” flows, and keep users in control when actions matter</li><li>Debugging with TanStack DevTools - Inspect requests, responses, tool calls, timing, and streaming behavior so you can troubleshoot fast and iterate safely</li></ul>Prerequisites This workshop assumes you can build and run a React + TypeScript app locally and you are comfortable working with a basic server setup.<ul><li>Basic understanding of SSE and streaming is required (we’ll use streaming heavily throughout the workshop)</li><li>Experience with React is required (components, state, props, rendering lists)</li><li>Basic TypeScript knowledge is required (we’ll rely on types for tools and structured outputs)</li><li>You will need an OpenAI API key with available credits to use during the workshop exercises</li></ul>

Building AI-Powered Apps with TanStack AI: From Setup to Chat Tools

Alem Tuzlak

When React 18 was released with the first concurrent features, the documentation clearly stated, “The most important addition in React 18 is something we hope you never have to think about: concurrency.” It’s been a few years, and by now it’s clear that this statement was optimistic. You definitely need to think about concurrency if you want to unlock the full potential of modern React features. In this deep-dive session, we’ll travel between several domains—from classic computer science theory and operating systems to UX and user psychology—before finally deep-diving into React’s reconciler over the years. By the end of this session, you can expect to have a deep understanding of React’s concurrent features—from Suspense and useTransition to useDeferredValue and the brand-new Activity component.But more important than understanding these specific features is obtaining the theory and knowledge to understand any future concurrent features as they are released.

Conquering React Concurrency

Ariel Shulman

AI has made building software faster, but it has also quietly changed the environment engineers are operating in. Responsibility hasn’t disappeared; it has concentrated. Decisions are harder to trace, failures are harder to localize, and humans remain accountable inside systems they no longer fully control.Drawing from experience designing systems for extreme environments, where visibility is limited, failure cascades, and human limits must be designed for, this talk reframes AI-assisted development as an operational challenge, not a tooling one. It introduces a different lens: treating AI-driven systems as architecture that must be operated like extreme environments, instead of faster versions of normal ones.

Operating at the Edge: What Extreme Environments Teach Us About AI Systems

Michal Ziso

React Summit

I am attending the largest #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 2026

FocusReactive

TinyMCE

Hygraph

Storyblok

Sentry

Vercel

ImageKit

CodeRabbit

Workflow Builder by Synergycodes

Algorand

Checkly

AG Charts

Tolgee

Embrace

Move faster with intuitive React UI tools

Checkly lets you test, monitor, and fix your app, in one workflow powered by Playwright.

AG Charts is a new JavaScript Charting Library built by AG Grid. With support for React, Angular, Vue and Vanilla JS, AG Charts is built with the same focus on performance, reliability and ease of use you've come to expect from us, and works seamlessly alongside AG Grid or as a completely standalone solution. Get started with our free community version, or upgrade to Enterprise to access advanced series types and features, which you can also use via Integrated Charts in AG Grid. Learn more at <a href="https://ag-grid.com/charts/" target="_blank" rel="noopener noreferrer">ag-grid.com/charts</a>.

Storyblok is a CMS that works with all modern frameworks and platforms so you are completely free to choose the best option for your project. Kickstart a new CMS project with your favorite technology in a matter of minutes, and for free.

Sentry is essential for monitoring application code quality. From Error tracking to Performance monitoring, developers can see clearer, solve quicker, and learn continuously about their applications — from frontend to backend.&nbsp;

With Vercel, you can just ship things. Build, scale, and secure a better web at vercel.com.

ImageKit's real-time image and video API helps optimize &amp; transform high-quality visuals on the web.

Media delivery & management for high-growth teams

CodeRabbit is an AI Code Reviewer that works with your existing tool chain like ESLint, Biome, and provides context-aware code review comments with 1-click computable suggestions.&nbsp;CodeRabbit is free for open source.&nbsp;

Workflow Builder, created for developers by developers, simplifies workflow editors’ creation with drag-and-drop nodes, ready-to-use templates and hassle-free integration with backend.

Build your workflow app in days, not months

Algorand is an energy-efficient, quantum-secure, single-layer blockchain with instant finality, consistently high throughput, and low fees.

Tolgee helps devs make apps multilingual without losing their minds. It’s open-source and offers native React integration with accurate contextual translation. <a href="https://tolg.ee/qwx6zk" target="_blank" rel="noopener noreferrer" id="isPasted">Learn more</a>.

Translate your app to any language without developer’s time wasted

Embrace provides modern Real User Monitoring for web and mobile apps that’s built on OpenTelemetry.

FocusReactive is a <a href="https://focusreactive.com/nextjs-agency">NextJS expert agency</a> with deep expertise in <a href="https://focusreactive.com/headless-cms-agency">Headless CMS</a> and <a href="https://focusreactive.com/headless-commerce-agency">Headless Commerce</a>. Independent <a href="https://focusreactive.com/storyblok-expert-agency/">agency partners of Storyblok</a>, Payload CMS, Vercel, Shopify, and Sanity to build fast, scalable, SEO-friendly platforms - and provide NextJS tech &amp; AI SEO audits to optimize existing sites.