Component Based Theming in the Real World
summary
Shows a concrete workflow that wires a Pattern Lab Twig component library into Drupal 8 using a subtheme, Pattern Lab’s source folder and the Libraries/namespace trick so the same .twig files render in both places. Demonstrates a card component, a demo repo and a Drupal site that includes that pattern, and compares using Twig Field Value helpers versus the UI Patterns module for UI-configurable mappings. Calls out real failures: brittle deep render-array mapping, caching pitfalls, editor UX and onboarding costs, and where integration eases or complicates reuse.
AI-written summary · about
chapters (8)
- 0:00Introduction
- 10:56High-level concepts
- 14:50Building a card component
- 24:40Mapping Drupal data
- 34:37Challenges and solutions
- 38:49UI Patterns module demo
- 44:36Future of component-based theming
- 46:42Q&A
related talks
59mGetting Atomic with Pattern Lab
46mIntroduction to the UI Patterns module
26mComponents, Patterns and sh*t it’s Hard to Deal with
42mDrupal Twig and SDC Tips for Building Flexible Component Libraries
32mAn External Design System in Practice
42mComponents everywhere! - Bridging the gap between backend and frontend
34mAdvanced React Component Patterns
39mStyling a design system based on Bootstrap 4 and Web Components