Achieving Reusability Through Componentization
Channel: Drupal North
Date: 10/08/2018

Pierre Marcel & Sean Homer

You’ve been to the other talks about Pattern Lab, Atomic Design, or Componentization, and you’ve maybe even built a site or two using these concepts. Yet, where do you go to from there? Likely, using componentization doesn’t mean you’ve created something that is actually reusable and that’s what we’re going to cover in this talk.


But why is reusability important? If you’re like us, you crave to save precious resource cycles building the same thing over again. 


Componentization on it’s own without a strong strategy isn’t enough. A solid methodology must be established that works well for your organization.


From this session, attendees will gain insight into how to overcome challenges around reusing components. Additionally, attendees will be well positioned to develop their own reusable component library after taking the concepts introduced within this session and applying that knowledge to their own projects.


Topics we will be covering during the session will include:

Establishing a set of architectural standards (directory structure, naming conventions, data modeling…)
Making structural decisions when creating components -- which are special unicorns, which are reusable, and what elements should be brought back in the base components?
Packaging components for reusability across different Drupal projects
A look at the tools and libraries along our componentization journey:
Atomic Design
BEM, SMACSS
Using build tools to automate and streamline the development workflow towards saving time and component reusability
Our team has been working towards these goals for well over 3 years now. We have had great success in several client projects, and we have also learned many lessons along the way. We’ve explored different approaches and had the willingness to accept that a direction wasn’t working and adapt.

https://drupalnorth.org/en/session/achieving-reusability-through-componentization