Component-integration with a Drupal website is one of the most difficult process to grasp when developing with the component-based approach.  There are so many scenarios for how values from Drupal fields should be retrieved.  Drupal doesn't make things easier either since in most cases Drupal will not render just the value of a field but instead provides a full array for a field.  In addition, retrieving field values from Drupal may require multiple Twig templates and these also vary depending on the entity type you are working with (i.e. blocks, views, nodes, paragraph types, media, etc.).  You will be surprised to learn that sometimes the problem with integrations may be the result of how components are built and this is why is important to start thinking of Drupal even as early as when drafting the markup for the components.


Topics we will cover

  • In this workshop we will get to the bottom of component integrations.
  • We will cover how to build components in your design system (i.e. Pattern Lab), with Drupal in mind.
  • We will review how to account for Drupal attributes, title_prefix, and title_suffix in your components.  Also we will cover what all of this means in general on a drupal website.
  • We will explain how to properly break down components based on how Drupal handles the equivalent of the components we are building.
  • We will make heavy use of View Modes which help Drupal do the heavy lifting for managing fields and how to render them.
  • We will use the twig_field_value and twig_tweak modules to properly rendering fields as well as debugging Drupal's render arrays. 
  • Finally, not properly rendering fields in Drupal can lead to caching issues.  We will cover how to ensure we are rendering fields the way Drupal expects it and therefore avoiding caching issues.


Who would get the most out of your training?

This training is primarily for front- and back-end developers who wish to learn how to build Drupal websites using the component-based approach, or who have already had some experience with components in a Drupal website.


What do you expect people to be able to take away from your training?

  • Building flexible and scalable components using Twig and Pattern Lab
  • Best practices for Drupal theming and development
  • Drupal’s content array and how to preserve caching
  • Debugging a theme to obtain fields and variables information
  • Working with Twig template suggestions
  • How to integrate front-end components with Drupal
  • Best practices for using Twig’s include, embed, and twig blocks
  • Working and planning for Drupal attributes
  • Building reusable components


How much and what kind of technical knowledge do people need going in to your training?

Good understanding of Drupal's ecosystem is required to follow along with the training.  Beginner to intermediate front-end or back-end development experience is useful.


Other requirements

  • A running Drupal 9 website will be required (If not using Mediacurrent's training environment, ensure your website is up and running)
  • This is a hands-on training and coding experience is required to follow along with exercises.
  • A code editor of your choice
  • Enable the following modules:
  • Enable twig debugging (disable cache)


Please Note: Registration for this training is a seperate ticket. 


Register for This Training Today