Module 3 – Front‑end Development (Theming) – Overview

By saroj 18 December, 2025 Difficulty: Intermediate

Front‑end Development (Theming) represents 25% of the exam, which is significant. Acquia uses this domain to test whether you understand:

  • How Drupal separates logic from presentation
  • How themes fit into the Drupal request–response lifecycle
  • When to use configuration, Twig, preprocess, or CSS/JS

This module is not about visual design skills. It is about correct Drupal theming architecture.

What “Front‑end Development” means in Drupal

In Drupal, front‑end development is about:

  • Controlling HTML output
  • Styling content
  • Attaching assets (CSS/JS)
  • Ensuring accessibility, performance, and maintainability

It is not about building business logic or querying data.

Theme vs Module (core distinction)

Modules:

  • Provide data and functionality
  • Contain business logic

Themes:

  • Control markup and presentation
  • Do not contain business logic

Exam signal:
If logic is required, the answer is module, not theme.

Drupal theming layers (important mental model)

Drupal renders output in layers:

  1. Data (entities, render arrays)
  2. Theme system
  3. Twig templates
  4. HTML/CSS/JS

Themes only work on render arrays, not raw data.

What a Drupal theme contains

Typical theme elements:

  • .info.yml
  • Twig templates
  • CSS files
  • JavaScript files
  • Preprocess functions (in .theme file)

Themes should remain presentation‑only.

Sub‑themes (very common exam topic)

A sub‑theme:

  • Inherits from a base theme
  • Overrides templates and styles
  • Avoids duplication

Common base themes:

  • Olivero (core)
  • Claro (admin)

Exam signal:
If customization is needed, sub‑theme is preferred over modifying core or contrib themes.

Decoupled and Headless Drupal (clarified simply)

Traditional Drupal (coupled)

  • Drupal handles backend and frontend
  • Uses Twig for rendering

Decoupled Drupal

  • Drupal provides data (REST/JSON)
  • Frontend built with React, Vue, etc.
  • Drupal still serves some pages

Headless Drupal

  • Drupal only provides APIs
  • No Twig frontend
  • Frontend is completely external

Important:

  • Theming exam questions focus on traditional (coupled) Drupal
  • Decoupled/headless is awareness‑level only

How theming affects performance

Correct theming improves performance by:

  • Reusing templates
  • Using view modes
  • Avoiding logic in Twig
  • Leveraging caching

Bad theming hurts performance by:

  • Heavy conditional logic in Twig
  • Inline styles/scripts
  • Duplicated templates

How theming affects security

Themes:

  • Should escape output automatically (Twig)
  • Should not process user input
  • Should not access the database

Security logic belongs in modules, not themes.

How theming affects maintainability

Good theming:

  • Uses view modes, not conditions
  • Uses preprocess functions sparingly
  • Keeps Twig simple

This reduces long‑term maintenance cost.

Front‑end Developer vs Drupal Themer

A Drupal front‑end developer:

  • Understands Twig
  • Understands render arrays
  • Understands Drupal caching

Pure HTML/CSS skills are not enough for Drupal theming.

Acquia Theme Certification (brief awareness)

Acquia Front‑end / Theme certifications focus on:

  • Twig usage
  • Preprocess functions
  • Asset libraries
  • Template overrides

The Developer exam tests awareness and correctness, not advanced CSS.

Common exam traps in Module 3

  • Writing logic in Twig
  • Querying data in templates
  • Modifying core themes
  • Ignoring view modes
  • Using JavaScript for layout decisions

Correct answers favor clean separation.

Key takeaways for Module 3

  • Themes control presentation only
  • Logic belongs in modules
  • Twig should stay simple
  • Sub‑themes are preferred
  • Traditional Drupal theming is the exam focus

What comes next

Module 3 will be broken into deep dives:

  • 3.1 Themes and Sub‑themes
  • 3.2 Theming concepts
  • 3.3 Twig syntax
  • 3.4 Template overrides
  • 3.5 Preprocess functions