Advanced Components
  • Welcome
  • Start here
    • Setup
    • Dependencies
  • Getting Started
    • Front-end tooling
    • Create a new D9 theme
    • Component Architecture
    • Drupal Best Practices
    • Drupal Attributes
    • Twig Blocks
  • Basic Components
    • Global styles
    • Adding webfonts
    • Heading Component
      • Improving the Heading
    • Button Component
  • A component's lifecycle
    • Hero Component
    • Include statements
    • Drupal prep
    • Drupal entities
    • Homepage content type
    • View modes
    • Add Hero to homepage
    • Drupal cache & twig debugging
    • Twig template suggestions
    • Getting field values
    • Integrating the Hero
    • Drupal Libraries
    • Hero Image styles
  • Card component
    • Card Component
    • Component Variants
    • Card Variant
    • Author component
  • Drupal site building
    • Blog articles
    • View modes
    • Drupal Views
    • Author
    • Generate content
    • Adding Blog Lists to the Homepage
  • Drupal Integrations
    • Integrating the Card
      • Taxonomy terms
    • Integrating the Card Wide
    • Author integration
    • From our blog
    • Integrating From our blog
    • Featured Content
    • Integrating Featured Content
    • Blog image styles
    • Blog detail page
  • Extras
    • Image Styles
    • Navigation
  • Resources
    • Resources
Powered by GitBook
On this page

Was this helpful?

  1. Getting Started

Front-end tooling

PreviousDependenciesNextCreate a new D9 theme

Last updated 3 years ago

Was this helpful?

In a fast moving industry like ours, it is imperative that we have tools that allow us to build environments (front and back-end), quickly while providing consistency. The same way we have DevOps processes for quickly spinning off a complete Drupal website built with composer, Drush, Drupal Console and more, we need a system that automates the Drupal theme creation process in an effort to provide all the essential tools needed for a modern, best practices, and standards compliant front-end environment.

Here are some of the tooling we'll be using during this training:

  • : For building modern, component-ready Drupal 8 themes.

  • : Design system for a pattern library and living style-guide.

  • : A Javascript runtime system used by most modern apps today.

  • : Node Version Manager.

  • : Node Package Manager to manage node dependencies.

  • : Task runner to automate repetitive tasks such as code compile and more.

Mediacurrent's Theme Generator
Pattern Lab
NodeJS
NVM
NPM
Gulp