Mastering Drupal: A Hands-On Tour of the Experience Builder with Lionel Enkaoua (Part 1)

Explore the cutting edge of Drupal site building in this hands-on walkthrough of the **Drupal Experience Builder (XB)**! In this first of a two-part series, Lionel Enkaoua—Drupal Architect at Linnovate and key contributor to the Experience Builder initiative—guides Drupal Forge's Darren Oh through XB's powerful visual interface. See how drag-and-drop layouts, reusable components, flexible slotting, and even custom React components come together to create beautiful, responsive pages without writing code. This session includes live testing, insight into bug fixes, and previews of what’s to come. (Spoiler: Part 2 is on the way!) Whether you're a Drupal pro or new to visual page building, this is a must-watch deep dive into the future of Drupal theming and content creation. Chapters: 00:00 Introduction & goals of the walkthrough 00:48 Why Experience Builder is a game changer 01:18 Overview of the demo page and project background 02:25 Using recipes, default content, and YAML exports 03:05 Understanding SDC components and slot structures 04:31 Live editing with hero components and slots 06:04 Duplicating and modifying components 07:53 Responsive preview and breakpoints 08:38 Interactions between sidebar and viewport 09:02 Containers, props, and layout constraints 10:52 Column settings and dynamic content management 11:52 Testimonial component structure 12:30 Adding new components from the library 13:25 Creating and editing new pages 14:29 Troubleshooting invisible components 15:23 Layout manipulation with flex and spacing 17:28 Exploring annotation and custom component creation 18:24 Building custom React components inside the UI 20:13 Adding props and previewing custom components 21:46 Live component preview and issues 22:59 CLI support for importing/exporting components 23:52 Saving custom components to reuse 24:18 Creating and reusing design patterns 26:22 Global regions and reusable page elements 28:16 Theme settings and region configuration issues 29:54 Making header/menu components globally reusable 30:23 Final thoughts and shoutouts Credits: Darren Oh,   / daoh   Lionel Enkaoua,   / lionel-enkaoua   Infrastructure, tooling, and AI provider by [https://devpanel.com/](https://devpanel.com/) #Drupal #DrupalCMS #DrupalAI #DrupalExperienceBuilder #VisualSiteBuilder #OpenSourceWebDesign #DrupalUX #SDCComponents #DevPanel #DrupalForge #Linnovate #DrupalXB