Drag n' Drop/Mix n' Match: Patternkit + Layout Builder - The Next Gen of Drupal Page Building

Jul 14, 2019

Derek Reese

If you've worked on large enterprise site themes, you're probably tired of writing Twig to map in your hand-built pattern libraries to Drupal templates. If you're building sites solo, it'd be nice to not have to use 20 different modules to get all the blocks you need to make your front-end look just right after theming, or have to resort to using the pre-build Bootstrap bundles.

Patternkit (https://www.drupal.org/project/patternkit) attempts to solve these problems by allowing you to import existing Pattern Libraries directly into Drupal as blocks, drop them into your layouts using the Layout Builder core module, then map in your existing content as needed. Keep your content types (and therefore schema) as simple and sensible as possible and let Patternkit do what it does best: display the patterns you choose with your content. It's like the ui_patterns module (https://www.drupal.org/project/ui_patterns) - but much more flexible.

We'll show you how to go from our Git repo with a Pattern Lab (https://patternlab.io/) library to a fully-built Drupal site with dynamic components and content using only Drupal Core, Patternkit, and a custom component library - and then a dash of how to expand on what we've built!

Hi! I'm Karim Boudjema, the developer and site-builder of this site. I'm currently working as a freelance Drupal developer.

I was wondering how could I giving back to the Drupal community all what it gave to me during the last 10 years, that's how the idea of this site came to me ... (read more)

Hi! I’m Santiago Rico, the web designer and themer of this site.

When Karim proposed me to design and theme this site for the Drupal community, I accepted immediately because the community is the main reason why I love Drupal so much.