Name: React Advanced 2026
Start: 2026-10-23T08:00:00.000Z
End: 2026-10-26T22:00:00.000Z

Lera

David Barry

Gerson Enriquez

Sanketh Kumar

Fathima Fasna

Vitor Barbosa

Tamara

Joel E.

Ben Durrant

Jessica Aguerrevere Clements

Hubert Altar

mudra

Noé Tatoud

Igor Alekseev

Varya Stepanova

Andy Mthembu

Mahmoud Khalafallah

Yakovlev Eugen

eran

Wahab Hussain

Steve Zhivodkov

Laura Alspaugh

React Advanced 2026 attendee

Varun

Alena Diachkovskaia

Natalia Barsova

Iandra Bedin

Michael Chiche

Anastasiia Vasylevych

Sarkis Kovlekjian

Alaina Jaffer

Sylus Abel

Gaurav Kumar

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 along with React's "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

We built a product fully on TanStack Query and skipped adding a state management layer. It worked for a while, then it broke in ways we didn’t expect.This talk dives into how TanStack Query works, what we got wrong, and how to use it properly. From missing optimistic updates to confusing server and client state, we’ll break down the lessons learned and what patterns actually scale when your app grows.

How Not to Use TanStack Query

Neciu Dan

You know how to build client apps—but where do client developers fit in the new world of ChatGPT and MCP? If you’ve used GraphQL before, it turns out your knowledge translates directly. This talk demonstrates how to build MCP apps using Apollo Client’s new open source AI apps integration along with the open source Apollo MCP server with patterns you already use:<ol><li>Fragment colocation → Tool design: Structure MCP tools as component data requirements</li><li>Query optimization → Tool call patterns: Minimize LLM roundtrips with the same performance thinking</li><li>Type safety → Tool schemas: Apply GraphQL’s type discipline to MCP definitions</li></ol>A live demo builds an MCP app querying a GraphQL API, showing how best practices from GraphQL client development apply to MCP apps.

Building MCP Apps With React and GraphQL Patterns You Already Know

Jerel Miller

How many times have you had to tell Claude Code to stop reaching for useEffect?React’s flexibility is a strength for developers, but it often leads AI tools in the wrong direction, introducing subtle bugs and drifting away from production-ready code without clear guidance.In this talk, Abhijeet Prasad, maintainer of Braintrust’s AI observability SDKs, shares practical ways to keep your agents on track and writing production-ready React. You will start with simple guardrails and skills that shape better behaviour, then move toward a more powerful setup: an eval pipeline that continuously improves your agents by driving updates to lint rules, skills, and agent instructions.

Teaching AI to Write Production-Ready React

Abhijeet Prasad

React Server Components are often treated as a framework feature, but they make more sense as a serialization format and a runtime primitive. This talk presents how that mental model changes the way we think about rendering boundaries, composition, and system design in React. Drawing on real implementation experience, I'll show why this shift matters and what it makes possible beyond the assumptions of a single framework, especially for complex systems like a <a href="https://focusreactive.com/react-cms/" target="_blank">React CMS,</a> where server-first composition and serialization directly shape how content, workflows, and UI are modeled.

React Server Components Are a Serialization Format, Not a Framework Feature

Viktor Lázár

This workshop bridges the long-standing gap between React developers and production-ready delivery. Many front-end developers know how to build great interfaces but they stumble when it comes to building, testing, deploying, and monitoring those apps in real-world environments.This workshop gives React developers the DevOps superpowers they need.You’ll learn how to:<ul><li>Dockerize your React application for development and production following best practices from Docker Captain Leader.</li><li>Build scalable CI/CD pipelines using GitHub Actions</li><li>Optimize your apps for performance and reliability</li></ul>This is not theory. It’s not a shallow overview. This is a production-focused, real-world workshop by a front-end developer who lives and breathes this every day.

DevOps for React Developers: From Code to Production

Kristiyan Velkov

What if your React app could understand users without sending their data anywhere?Modern browsers can now run meaningful machine learning locally. This talk shows how to use in-browser ML to build React interfaces that personalize, adapt, and respond in real time, while staying fast, private, and predictable in production.

The Browser Is the Brain: Building Smart React UIs with In-Browser ML

Vishnudhasan Govindarajan

Almost a decade ago, React’s rendering algorithm was rebuilt, and with that it brought about new tools, ideas, and ways of building UI. But those tools arrived incrementally and were adopted in isolation, often framed as “optimizations” rather than part of a unified model. So are they truly independent ideas, or are they different expressions of the same underlying model made possible by the new rendering algorithm?Join us as we re-introduce "Async React" as the mental model for modern react and show how we can write more declarative code, embrace async-first as the default and let React handle the rest.

From Fiber to Async React

Nonso Otoh

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

Next.js 16 introduced cache components, a fundamentally new approach to caching that replaces implicit behavior with explicit, composable control. In this talk, I'll build a dashboard from scratch to show you how cache components work in practice: how the static shell gets prerendered and served instantly from the edge, how 'use cache' caches expensive data on your schedule, and how Suspense streams dynamic content in real time, all in the same route. You'll see the three 'use cache' variants in action, learn the donut pattern for maximum performance, understand why generateStaticParams matters more than you think, and walk away with practical patterns for cache invalidation that work in production.

Mastering Next.js Cache Components

Jonas Herrmannsdörfer

Publishing a shared component library feels like a milestone, until a single change breaks multiple applications at once.While working on a monorepo at EPAM Systems powering 8 production applications for a global supply chain platform, we built a shared ecosystem of independently deployable frontend packages: authentication, navigation, app shell, user profile, and UI components. On paper, it promised consistency and speed. In reality, it introduced a new class of problems, subtle, cross-app, and often hard to debug.A mismatch in React versions led to duplicate instances and unpredictable behavior across apps. Small feature requests from different teams slowly turned shared components into overly flexible, inconsistent abstractions. Even “safe” refactors required coordinating across teams, managing rollouts, and avoiding breaking changes in production systems we didn’t fully control.This talk goes beyond best practices to explore the real trade-offs of shared frontend architecture at scale. I’ll walk through concrete failures, decisions, and constraints we faced — and the strategies that actually worked: strict dependency contracts, opinionated API design, staged migrations, and clear ownership models.If you’re building or maintaining shared packages in a monorepo or multi-app ecosystem, this talk will help you avoid common pitfalls and make better architectural decisions — before they impact multiple teams at once.

The Hidden Cost of Shared Frontend Code: Lessons From 8 Apps and One Monorepo

Mansi Manhas

Get ready for an annual deep dive into the latest trends in React and Web development. Learn from engineers behind the framework ecosystem and early adopters at the main React Conference in the UK.The concept of the event is both about covering all you need to catch up on in the React ecosystem, combined with deep technical exploration of the latest architectural trends, new feature adoption, and efficient ways to solve complex problems.Engage in discussion rooms, hallway track with experts, hands-on practical workshops, and tens of insightful talks. Engineers of any level are welcome but be prepared for hardcore.

React Advanced

Get ready for an annual deep dive into the latest trends in React and Web development. Learn from engineers behind the framework ecosystem and early adopters at the main <a href="https://reactadvanced.com/">React Conference in the UK</a>.The concept of the event is both about covering all you need to catch up on in the React ecosystem, combined with deep technical exploration of the latest architectural trends, new feature adoption, and efficient ways to solve complex problems.Engage in discussion rooms, hallway track with experts, hands-on practical workshops, and tens of insightful talks. Engineers of any level are welcome but be prepared for hardcore.

React Advanced 2026

FocusReactive

Hygraph

Sentry

Bryntum

Cloudflare

Auth0 by Okta

Move faster with intuitive React UI tools

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;

Secure AI agents, humans, and whatever comes next

FocusReactive is an&nbsp;<meta charset="utf-8" id="isPasted">engineering-led <a href="https://focusreactive.com/services/headless-cms-expert-agency/">Headless CMS Agency</a>&nbsp;and&nbsp;<a href="https://focusreactive.com/next-js-expert-agency/">NextJS&nbsp;development experts</a>. Independent partners of Payload CMS, Sanity, Storyblok, Vercel and Shopify. Delivering&nbsp;<meta charset="utf-8" id="isPasted">Composable content platforms built for AI SEO, growing teams, and marketing velocity.