Practical Componentization: Improving Drupal development & site building (PatternLab)
Pierre Marcel & Sean Homer
Componentization is a growing consideration for web shops everywhere, and for good reason. For too long have we reinvented the wheel from project to project, spending countless hours (and sanity) creating variations of the same thing. Thankfully, tools and concepts around this have been evolving and expanding in recent years.
One of the biggest talked about tools in this space is Pattern Lab. On its own, this tool is a living style guide, but what makes it so popular is its easy pairing with the design methodology, Atomic Design.
When it comes to Drupal, there is no lack of options on how to build websites, but therein lies the problem: having too many options. This is where componentization through Pattern Lab can help to change your course with building sites going forward. Added with the Paragraph module on Drupal, you can easily tie all of these elements together to revolutionize your development.
We will explore what these tools provide, how they can help not only in the development process, but also in creating an improved site building experience. As well, we will demonstrate these tools in action from a pragmatic approach for you to make use of them yourself with ease.
Who is this talk for?
While this talk will contain technical elements, it is also geared to anyone with interest in the future of web development and site management.
Front-end architects, project managers, and site builders will get the most benefit from the focus of the content, but backend devs keep our sites alive and are always welcome too!
What you will learn?
A brief intro on:
What is Pattern Lab, Atomic Design, and why they would be helpful in Drupal
How to use the Paragraphs module and tie them into Components
A brief on the build process:
How to get up and running with Pattern Lab in Drupal
Helpful features to make use of
A live demo on:
Creating a Component
Adding a Paragraph
Tying in a Paragraph Template to the Component
How to build a page layout
A quick example of a ready-to-go exported Paragraph/Pattern to reuse in a future site
Who are the presenters?
Pierre Marcel
Pierre Marcel is a senior Drupal front-end architect. He’s been working with Drupal for almost 11 years since he built his first Drupal site in 4.7. For the past 2.5 years, Pierre has been focusing on componentization and how to apply the DRY system that many Backend Drupal developers use, to Drupal frontend development. Pierre is also the vice-president and one of the organizers at DrupalTO (Toronto Drupal User Group), focusing on organizing events and sharing Drupal knowledge within the local community.
Sean Homer
As senior web developer working at Therefore Interactive, I’ve dabbled in many avenues of web. Coming from a jack of all trades PHP developer with experience in WordPress and Drupal, to working heavily with NodeJS, for the past few years I chosen to focus more intently on front-end development. Improving and elevating standards and build tools for front-end, and helping make teams run well with less stress is my primary goal with all of my efforts. Outside of work, I have fun writing a novel and playing music, which is really more work... so ‘fun’ is illusive to me. :D
https://drupalnorth.org/en/session/practical-componentization-improving-drupal-development-site-building-patternlab
Componentization is a growing consideration for web shops everywhere, and for good reason. For too long have we reinvented the wheel from project to project, spending countless hours (and sanity) creating variations of the same thing. Thankfully, tools and concepts around this have been evolving and expanding in recent years.
One of the biggest talked about tools in this space is Pattern Lab. On its own, this tool is a living style guide, but what makes it so popular is its easy pairing with the design methodology, Atomic Design.
When it comes to Drupal, there is no lack of options on how to build websites, but therein lies the problem: having too many options. This is where componentization through Pattern Lab can help to change your course with building sites going forward. Added with the Paragraph module on Drupal, you can easily tie all of these elements together to revolutionize your development.
We will explore what these tools provide, how they can help not only in the development process, but also in creating an improved site building experience. As well, we will demonstrate these tools in action from a pragmatic approach for you to make use of them yourself with ease.
Who is this talk for?
While this talk will contain technical elements, it is also geared to anyone with interest in the future of web development and site management.
Front-end architects, project managers, and site builders will get the most benefit from the focus of the content, but backend devs keep our sites alive and are always welcome too!
What you will learn?
A brief intro on:
What is Pattern Lab, Atomic Design, and why they would be helpful in Drupal
How to use the Paragraphs module and tie them into Components
A brief on the build process:
How to get up and running with Pattern Lab in Drupal
Helpful features to make use of
A live demo on:
Creating a Component
Adding a Paragraph
Tying in a Paragraph Template to the Component
How to build a page layout
A quick example of a ready-to-go exported Paragraph/Pattern to reuse in a future site
Who are the presenters?
Pierre Marcel
Pierre Marcel is a senior Drupal front-end architect. He’s been working with Drupal for almost 11 years since he built his first Drupal site in 4.7. For the past 2.5 years, Pierre has been focusing on componentization and how to apply the DRY system that many Backend Drupal developers use, to Drupal frontend development. Pierre is also the vice-president and one of the organizers at DrupalTO (Toronto Drupal User Group), focusing on organizing events and sharing Drupal knowledge within the local community.
Sean Homer
As senior web developer working at Therefore Interactive, I’ve dabbled in many avenues of web. Coming from a jack of all trades PHP developer with experience in WordPress and Drupal, to working heavily with NodeJS, for the past few years I chosen to focus more intently on front-end development. Improving and elevating standards and build tools for front-end, and helping make teams run well with less stress is my primary goal with all of my efforts. Outside of work, I have fun writing a novel and playing music, which is really more work... so ‘fun’ is illusive to me. :D
https://drupalnorth.org/en/session/practical-componentization-improving-drupal-development-site-building-patternlab