Mapping components to Drupal structures

Now that we’ve analyzed all the components that have been designed for the demo site, the last step before starting with the implementation of the theme itself is mapping those components to the Drupal data structures.

Note

Some components are generic, and you can probably find them in all design systems. Some other components that you’ll find in the storybook/stories folder are specific to Drupal, and they allow us to build full pages in Storybook with markup as similar as possible to the one produced by Drupal. The good thing is that, once you’ve defined all those structural components in Storybook, you can reuse them on every Drupal website that you need to style.

Drupal is a complex system, and the same requirement (both graphical and functional) can be implemented in many different ways.

Looking at the provided mockups, we had to make choices. Which modules do we install? Which content types do we create...