Using Component Libraries to Manage UI Components Seamlessly
Splitting a webpage into several component units that can be manipulated programmatically is a valuable resource for a developer who loves to reuse their components on multiple pages. Suppose you employ a third-party tool such as Storybook to render the front end. Each time a code change happens in one of your modules at the backend Drupal implementation, you may have to tinker with the frontend code separately or would see it breaking.
That is when component libraries come to the rescue.
Lullabot, a mainstream Drupal company, has published a detailed tech post on component libraries. The post begins with their interpretation of what a component is. Mateu Aguiló Bosch, the post’s author classifies a Drupal component as a combination of a twig template, Metadata describing the input data the template accepts, optional JavaScript and optional styles.
Then the post differentiates a component from a block plugin used for progressive decoupling approaches. It then talks about the limitations of the Components module and progresses to talk about CL Components, a Drupal project that Lullabot developed.
Moving away from emulating Drupal in the component space, where a single code change can cause faulty rendering on the client-side, Bosch writes about using CL Components to couple Drupal with Storybook, a react application. Here, the rendering is done by Drupal, and it supplies an Html page that Storybook can use as-is, shredding down unwanted elements.
Read the blogpost here: Component Libraries in Drupal | Lullabot
Note: The vision of this web portal is to help promote news and stories around the Drupal community and promote and celebrate the people and organizations in the community. We strive to create and distribute our content based on these content policy. If you see any omission/variation on this please let us know in the comments below and we will try to address the issue as best we can.
Related Organizations
Comments
You may also like
