Skip to content

Single Directory Components (SDC)

I need to... Guide
Understand SDC architecture and plugin system SDC Architecture
Know component file structure and naming Component File Structure
Define component YAML schema properly Component YAML Schema
Write Twig templates for SDCs Twig Templates in SDCs
Add SCSS/CSS to components with proper scoping SCSS/CSS in SDCs
Add JavaScript with Drupal.behaviors JavaScript in SDCs
Compose components (include/embed/render) Component Composition
Decide between props and slots Props vs Slots Decision Framework
Create component variants (enum vs separate) Component Variants
Replace Drupal templates with SDCs Replacing Templates with SDCs
Test SDCs (Storybook, visual regression) Testing SDCs
Optimize performance (libraries, caching) Performance
Prevent XSS and security issues Security
Avoid anti-patterns and code review issues Anti-Patterns