Theme development workflows for the Enterprise

Presentation of full stack frontend development workflow tailored for the Enterprise needs. I will demonstrate to you all the important processes and tools that we are using when developing custom client themes.

Base concepts and tools

• History of how we got here and why,
• More Power vs More Flexibility vs More Rules dilemma,
• Keep the compatibility while adding new stuff,
• Overengineering trap,
• Base themes with a toolbox that follows your project from start to finish and beyond that, the maintenance period,
• Bootstrap 4,
• Chosen out of the box look and feel of base themes,
• Gulp workflow,
• Composer workflow.

SASS organization and improvements

• SASS code organization,
• SASS/CSS inheritance,
• SASS @import flattening feature,
• SASS/CSS opt-out feature.

Component approach

• Components and atomic approach,
• Twig organization with a focus on easy extension (twig block, include and extend directives),
• Paragraphs and paragraphs_collection.

Advanced built-in tools

• Custom update theme API,
• Drush command tools,
• Testing: Behat and Wraith,
• Organized automation.

Closing

• Documentation,
• Showcase of the successful projects,
• Credits,
• Plans for the future.

All important points will be covered with actual simple to understand working code demo examples.

List of Drupal contrib resources we will cover or mention in this presentation:

• https://www.drupal.org/project/bs_lib - Bootstrap 4 component library definitions and tools,
• https://www.drupal.org/project/bs_base/ - Base theme with a goal to support full front end Drupal theme development workflow from start to finish.
• https://www.drupal.org/project/components - Registers “component libraries” defined by your theme or module as Twig namespaces.
• https://www.drupal.org/project/paragraphs - Paragraphs is the new way of content creation!
• https://www.drupal.org/project/paragraphs_collection - Paragraphs introduced a powerful plugin system to attach behaviours to paragraph types.