The Drupal Front-End Specialization Certificate is part of Acquia's Drupal Certification Programs, and the name of the exam is Acquia Certified Drupal 9 Front-End Specialist. The fee for the exam is $300. This exam contains 60 scenario-based questions. You get 90 minutes to complete and require a minimum 68% score to pass the exam.
Why is Acquia Drupal 9 Front-End Specialist Certification necessary?
The certification will assess your knowledge of Drupal front-end development skills. It will validate the skills & knowledge of Drupal developers in fundamental web development, theming, template & preprocess functions, and site-building. Drupal front-end developers will get opportunities to accumulate knowledge and practical skills to improve their work efficiency. The exam tells you where you stand in the front-end area.
Essential exam-related topics
Acquia's Drupal Certification program
TOTAL = 60 Questions
- Fundamental Web Development Concepts (12-15 Questions)
- Theming Concepts (14-16 Questions)
- Templates Preprocess Functions (14-16 Questions)
- Layout Configuration (8-10 Questions)
- Performance (2-4 Questions)
- Security (2-4 Questions)
Find below some essential links and related topics to prepare for the certification exam.
Fundamental web development concepts
HTML
We create the structure of the web pages using HTML. Every front-end developer must have practical practice in creating a structure of the webpage with HTML.
Required knowledge: HTML5 Tags, Semantic Tags, Formatting Tags, HTML Block & Inline Elements, HTML Form Attributes, and HTML Media Tags.
Links:
HTML Block and Inline Elements
CSS
You need to have a strong understanding of setting the layout (UI) of a webpage with beautiful colors, fonts, styles, and more.
Required knowledge: Specificity in CSS, Box Model, CSS box-sizing Property, and Units.
Required hands-on practice: CSS Selectors, like Combinators, Pseudo classes, Pseudo elements, and Attribute Selectors.
Links:
JavaScript
We use JavaScript to add interactivity to the web pages. It helps you to make static web pages dynamic and interactive.
Required knowledge: Scope and difference of Var, Let & Const keywords, Operators, Loops & Arrays, Functions with Arrow & Map function.
Links:
PHP Programming concepts
It is essential to have a good basic knowledge of programming languages.
Required knowledge: How to clear the function calls, print array values, merge two or multiple arrays, and how the operator works.
Required hands-on practice: Data types, Operators, Loops & Arrays, and Functions & Strings.
To do: Create a function, use if conditions & operators in the function, and call another function in the function. Create arrays & check how we print all the values of the array & specific values of the array.
Links:
Responsive design concepts
A front-end developer should have good knowledge of how to make a website responsive so that it looks good on all devices, and which is the right approach for media queries.
Required hands-on practice: Writing CSS media queries and defining different style rules for different media queries.
To learn: Responsive web design & media query, CSS media query in the stylesheet, understanding the right approach for media query, and understanding width & device width.
Link:
Theming Concepts
It is necessary to practice & complete the Drupal Theming from Drupalize.me and Drupal.org
Links:
Building a sub-theme from a base theme
It is vital to know all about core themes and sub-themes as it is necessary to take care of all the required files & basic keys in the custom folder structure.
Required knowledge: Understand the folder structure, core themes, required files & keys in the subtheme.
To do: Create a subtheme with the set base theme as false, subtheme inheritance, and default fallback theme.
Links:
Define and use custom regions in a theme
Drupal FE developers should analyze all the pages of a website and decide the regions for the site. It is important to know about defining & printing the regions, which all Drupal default regions will be available, and from which file it will come.
Required knowledge: Definition of regions, printing the regions, and Drupal default regions.
To do: Practice defining no regions in the sub-theme, with only one region in the subtheme, and check which regions will be available.
Link:
Knowledge of working with stylesheets
It is necessary to understand the process of creating CSS or JS files, defining & attaching libraries, and how to override and extend the asset libraries of the Drupal core.
Required knowledge: Role of asset libraries, adding assets (CSS, JS) to a Drupal theme, ways to attach libraries to the specific and all pages, defining a library, overriding and extending libraries, and adding properties to include CSS/js.
To do: Practice with stylesheets to know how CSS & JS loads for modules and themes as an asset library in Drupal.
Link:
Adding Assets (CSS, JS) to a Drupal Theme
Working with theme configurations
It is important to know about the theme configuration of Drupal & how themes can modify the entire theme settings form by adding a PHP function, and how we can get the settings in the theme files.
Required knowledge: Understand the creation of theme settings in sub-themes, the use of theme-settings.php, learn the add, and get the setting values.
Link:
Creating Advanced Theme Settings
Working with breakpoints in a theme
Drupal front-end developers should use Drupal breakpoints with responsive image modules, know how to define the breakpoints in Drupal, which keys are required to define the breakpoints, and the working of breakpoint groups in Drupal.
Required knowledge: Understand the creation of breakpoints & breakpoint groups.
To do: Practice with breakpoints, use a breakpoint with a responsive image module, and read the advance use part.
Link:
Working with Breakpoints in Drupal
Working with JavaScript in a theme
Required knowledge: Drupal behavior, the use of Drupal behavior, why we use it, and the code syntax to write Drupal behavior functions.
To learn: Understand the use of these two arguments of the function (context & settings).
Understanding JavaScript behavior in Drupal
Required knowledge: How to run JavaScript in Drupal, why we need Drupal behavior, use context, settings & once(), and how to pass variables from PHP to JavaScript in Drupal.
Links:
Understanding JavaScript behaviors in Drupal
Templates Preprocess functions
Using Twig syntax
Twig is a default template engine for Drupal. If we want to output markup in a module or theme in Drupal, we need the Twig templating language & templates.
Understanding Twig in Drupal
Twig all tags - block, extend, auto escape, embed, include, use, merge, set, import.
Twig all filters - spaceless, strip tags, lower, upper, raw, capitalize, trans.
Classes and attributes in Twig templates - Add classes in attribute, add new attributes & attribute objects in Twig, and use without a filter in attributes.
Arrays & functions - Create a new array, add values in an existing array, and t function.
Links:
Filters - Modifying Variables In Twig Templates
Build and customize core templates for managing markup
Template files in Drupal are responsible for the HTML structure of all the Drupal pages.
Required knowledge: Steps of overriding the Twig template file & which order, Drupal template naming conventions, conventions page lists used for the base HTML structure, order of the templates, overriding the template file, & Twig template naming conventions.
Link:
Twig Template Naming Conventions
Work with template suggestions
Developers should know how to find the list of valid theme hook suggestions for any template file. We need to enable the Twig debugging mode to discover available theme hook suggestions.
To learn: Theme template suggestions alter, discover existing suggestions with debug mode, and add new theme hook suggestions.
Link:
Discover Existing Theme Hook Suggestions
Pre-process functions for overriding custom output
Required knowledge: In which file do we write the preprocess function, and when does the code of the preprocess function run.
To do: Add the same preprocess function in the theme & module. Check which one will run first. Which one overrides the existing one? Write the preprocess code for only specific node types.
Link:
Twig Best Practices - Preprocess Functions and Templates
Form alter and template suggestions alter
Developers should know the hooks for form-specific alteration in Drupal.
To do: Provide a form-specific alteration for shared ('base') forms, perform alterations before a form is rendered, and provide a form-specific alteration instead of the global one. Run the hook to alter the node_form for all nodes.
Link:
Layout configuration
You have to have good site-building experience in blocks, views, content, and entity reference fields.
Blocks
Developers should know when and how to create and configure blocks for building layouts.
Required knowledge: Strong understanding of blocks in Drupal, how to create a block, how to place it in one region and multiple regions, how to configure the block to display it in only specific types of content pages, and how to check other configurations of blocks.
Link:
Views
Developers should know how to create and configure views for building content list pages, blocks, and feeds.
Required knowledge: A good understanding of views with all configurations, how & when to create a view block & view page.
Required hands-on practice: The why & how to use relationships in views.
To do: Check all the settings of views (formats, fields, filter criteria, pager, and block), Expose, Grouping, Relationship, and Contextual Filters.
Links:
Layout Builder
We can create a different layout structure based on content type & as per page of the same content type. Use the Layout Builder module to build different layouts
Required knowledge: How to create a page layout using the layout builder.
Required hands-on practice: Working with the layout builder module.
To do: Change the layout on a content type basis, and change the layout on a per-page basis of the same content type.
Link:
Introduction to Layout Builder
Performance
Every front-end developer should know how to resolve the site performance issues arising from site configuration, what to do if a website is loading slowly, and how to take care of site performance.
Effective ways to improve the page performance
A few ways to improve front-end performance are to minify HTML, CSS, and JavaScript, aggregate CSS, and JavaScript, optimize images, leverage browser caching, and more.
Link:
Security
Resolve security issues arising from custom theme
Developers should write secure code for Drupal and use safe translation filters with placeholders while writing the code in a Twig file.
Writing secure code in a Twig file, & Safe Translation Filters with the placeholder
Link:
Filters - Modifying Variables In Twig Templates
New techniques implemented in Drupal 9 for security
Link:
Writing Secure Code for Drupal
Naming conventions & location of files
Link:
Extra introductions to read
Drupalize - Acquia Certified Drupal Front End Specialist Exam
Tip
Read the questions carefully. Be calm and relaxed during the examination.
Conclusion
The Drupal Front-End Specialist Certification helps to showcase your skills & knowledge in the area of Drupal Theming. It allows you to prove your experience and increase your value as a Drupal Front-End Specialist Developer.
All the best for your Drupal Front-End Specialization Certificate!