Component-based Theming with Twig (Double Session - Part 2)
Each iteration of Drupal introduces new and exciting ways to manage content. However, the display of content is even more important along with the knowledge of how to convert a design to a theme. While we have all read about, watched and even worked with Twig to create new themes in Drupal 8, the way we work with Twig has changed.
Join us as we walk through the theming variations that started with the traditional theme-centric design and has quickly moved into component-based design. Together we will master Component-based theming with Twig as we work to identify patterns, define components, utilize command line tools such as Composer, NPM, and Grunt to quickly create a PatternLab managed theme.
Learn how to work smarter in developing components that can easily be integrated into a project after project without having to recreate yourself.
If you consider yourself a front-end developer then you will be right at home learning all the newest techniques to take your skills to the next level as we master Component-based theming with Twig and Pattern Lab.
Learning Objectives:
You'll come away from the course with knowledge of:
- Best practices for Drupal 8 theming
- How Twig fits into the front-end development process
- How to define, develop and theme a component
- Steps for integrating PatternLab into Drupal
- How to work with assets, including JavaScript libraries
- Various techniques for componentizing Drupal
Lesson 5: Component Libraries
With the concept of creating components mastered, we will look at theming variations to create self-contained components that can be moved from project to project. We will also explore using the Component library module to enable Twig namespacing, allow for more advanced Twig syntax and enable PatternLab to be our canonical source for markup.Topics covered
- Working with Component Libraries module
- Twig Namespaces
- Pattern Lab as canonical source of markup
Prerequisites for this Course:
- You should have PHP 7 installed locally prior to this training.
- Understand how to work with HTML5, CSS3, Sass and JavaScript libraries
- Have a basic understanding of PatternLab, NPM, and the command line
- Have Composer and NPM installed on your computer.
You can find directions on how to install everything needed for the class at the following GIT repo.