Modern JavaScript with agentic engineering meets Drupal via Drupal Canvas Code Components. Learn what’s possible today, and what comes next.

Prerequisite

Attendees will get the most out of this session by being familiar with working with a modern JavaScript UI framework codebase.

Target Audience

This session is for frontend engineers who would consider building UI components using React for Drupal Canvas.

Outline

UI for the web in 2026 is largely written in JavaScript, backed by an exciting open source ecosystem and a wide pool of available talent. Drupal Canvas supports Drupal core's Twig-based Single-Directory Components, but also offers Code Components for projects that choose to author components in JavaScript and React — managed in a separate codebase, with no Drupal experience required.

Code Components were introduced at DrupalCon Atlanta. The approach was unconventional: people need a code editor and previews, so why not ship all that in the Canvas module? The result was an out-of-the-box code editor, previews, and support for React and Tailwind CSS. Drupal CMS 2 includes Canvas, so you get all this by default.

*Act 1* was the browser. Instant iterations with zero setup.

*Act 2* brought a CLI tool to sync components to and from a local codebase, extending the audience to engineers who preferred their own environment.

*Act 3* fully unlocked the JavaScript ecosystem and AI coding agent harnesses. A Code Components codebase is now just a JavaScript project — one you can even use as your decoupled frontend. We expanded the scope to include pages, content templates, and global regions. Canvas Workbench, a local preview environment, debuted at DrupalCon Chicago earlier this year.

Join the technical lead of Code Components to learn where Act 3 has landed, how you can leverage all the capabilities in your projects today, and to hear about the plans for the next act.

Learning Objectives

At the end of this session, attendees will understand where Code Components in Drupal Canvas are headed, and how they can be integrated today into a standard JavaScript codebase with agentic tooling.

Experience level
Intermediate