WeAreDevelopers Logo WeAreDevelopers
Sign in
For You LIVE
World Congress 2025 • Aug 20, 2025 • Session details

Building Interactive Async UI with React 19 and Ariakit

Aurora Scharff

Tired of wrestling with complex async states and accessibility bugs? Watch this Next.js refactoring masterclass to build robust, flicker-free components using React 19 and Ariakit.

Pause
Mute Enter Fullscreen
#1 about 3 min

Overcoming challenges in building accessible interfaces

Understanding the difficulties of delivering custom design capabilities while meeting strict WCAG standards and preventing asynchronous UI flickering.

#2 about 2 min

Exploring tooling choices for interactive UI components

Combining Tailwind CSS, Ariakit primitives, and React concurrent features to streamline flexible component development.

#3 about 2 min

Identifying usability flaws in the initial component

Reviewing an initial design implementation to expose broken keyboard navigation and disconnected asynchronous fetching states.

#4 about 2 min

Analyzing the initial monolithic component setup

Breaking down a tangled component hierarchy structured around manual state tracking and detached API endpoints.

#5 about 7 min

Refactoring components for accessibility compliance with Ariakit

Swapping generic elements with unstyled Ariakit primitives to automatically coordinate complex accessibility interactions and layout behaviors.

#6 about 4 min

Eliminating boilerplate with React 19 server functions

Handling asynchronous operations smoothly by replacing endpoint fetching layers with server actions triggered via the useTransition hook.

#7 about 2 min

Engineering instant UI feedback using optimistic state

Applying the useOptimistic hook to provide immediate visual responses combined with robust automatic error rollback functionality.

#8 about 3 min

Rapidly iterating on custom asynchronous interface features

Expanding the application cleanly by dropping in a fully interactive logout sequence configured over the same server architecture.

#9 about 3 min

Summarizing modern patterns for robust interactive components

Reflecting on how unified framework paradigms drastically reduce boilerplate code while actively elevating final product accessibility.

Matching moments

44 sec

Constructing basic UI components using React hooks

Marc Rousavy Marc Rousavy · World Congress 2025

3:08 min

Fundamentals of building interfaces with React

Daisy Muyldermans · LIVE

2:18 min

Assessing React dominance and the potential of web components

Laurie Voss · World Congress 2022

2:04 min

Advancing design tools for modern frontend development requirements

Kris Rasmussen Kris Rasmussen +1 · World Congress 2024

1:10 min

Creating interactive visual experiences with pure frontend code

Chris Heilmann Chris Heilmann +2 · LIVE

3:26 min

Leveraging existing web knowledge for developer experience

Xuan Huang Xuan Huang · World Congress 2025

More from World Congress 2025

GenAI Security: Navigating the Unseen Iceberg thumbnail
24:33
12 months ago

GenAI Security: Navigating the Unseen Iceberg

Maish Saidel-Keesing

Behind the Code: How Women Are Powering the Future of AI thumbnail
30:28
about 1 year ago

Behind the Code: How Women Are Powering the Future of AI

Alexandra Wudel, Laura Moritz, Madalina Florean

The AI Hype Filter: What’s Real, What’s Investable, What’s Noise? thumbnail
28:12
about 1 year ago

The AI Hype Filter: What’s Real, What’s Investable, What’s Noise?

Justus Lumpe, Konstantin Vinogradov, Nils Eiteneyer, Stephan Wirris

AI in Leadership: How Technology is Reshaping Executive Roles thumbnail
28:19
about 1 year ago

AI in Leadership: How Technology is Reshaping Executive Roles

Bernd Datler, Jasmin Kaiser, Jeff Hausmann, Sonja Alvarez

The AI-Ready Stack: Rethinking the Engineering Org of the Future thumbnail
28:09
about 1 year ago

The AI-Ready Stack: Rethinking the Engineering Org of the Future

Alex Laubscher, Jan Oberhauser, Keno Dreßel, Mirko Novakovic

AI Sovereignty: What Does It Take? thumbnail
29:13
about 1 year ago

AI Sovereignty: What Does It Take?

Boris Hecker, Clemens Wasner, Robin Hermann, Sonja Alvarez

Upcoming sessions on this topic

Open session

React Under Fire: Rendering Performance for Streaming Agent UIs

  • Abhirupa Mitra

    Slack

    Senior Member of Technical Staff

Open session

Designing for Every Direction: Logical CSS for Global, Adaptive, and Effortlessly Reversible UIs

  • Vidhya Krishnamoorthy

    Morgan Stanley

    VP, Software Engineering Manager

Open session

From Profiler to Production: Measuring What Actually Matters in React & React Native

  • Andrei Tazetdinov

    Dynatrace

    React Native Developer

Open session

Build a Zero-Cost AI Agent in Your Browser

  • Aishwarya Mathuria

    Adobe

    Computer Scientist

  • Nishant Thakur

    Adobe

    Senior Computer Scientist

Open session

How We Cut Our API's p99 Latency from Minutes to Under a Second

  • Deepak Agrawal

    Atlassian

    Principal Software Engineer

Open session

ULTRON: Your Agent Has No Hands - Real-Time Voice, MCP, and Ten Phones on Stage

  • Sagar Tamang

    Two Spoon Technologies

    AI Engineer

Related videos

Accessibility in React Application thumbnail
30:07
LIVE • almost 2 years ago

Accessibility in React Application

Julia Undeutsch

Making Interactions Accessible to All Users thumbnail
31:38
World Congress 2023 • about 3 years ago

Making Interactions Accessible to All Users

Anuradha Kumari

Typescript, React and Atomic Design - a match made in heaven thumbnail
40:05
LIVE • over 5 years ago

Typescript, React and Atomic Design - a match made in heaven

Nathalia Rus

WeAreDevelopers LIVE - Rendering in the Browser, The State of CSS and Accessibility and more thumbnail
1:02:33
LIVE • over 1 year ago

WeAreDevelopers LIVE - Rendering in the Browser, The State of CSS and Accessibility and more

Chris Heilmann, Daniel Cranney, Elena Torró

From Zero to Hero: NextJS 13 and Tailwind CSS for Beginners thumbnail
29:01
World Congress 2023 • about 3 years ago

From Zero to Hero: NextJS 13 and Tailwind CSS for Beginners

Marius Obert

Challenges of building React and React Native apps thumbnail
24:10
World Congress 2022 • over 4 years ago

Challenges of building React and React Native apps

Milica Aleksic, Stefan Nikolic

Related articles

From learning to earning

Jobs that call for the skills explored in this talk.