Building Blocks

Scaffold and refine AEM Edge Delivery blocks with standardized structure and styling.

1|Updated Oct 3, 2025
One-click install
npx skills add https://github.com/initialyze/acme-services --skill building-blocks-initialyze
Or copy as Structured Prompt for Agent
Please help me install this Agent Skill.
Skill: Building Blocks
Source: https://github.com/initialyze/acme-services/tree/main/.claude/.skills/building-blocks
Command: npx skills add https://github.com/initialyze/acme-services --skill building-blocks-initialyze

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

This skill guides teams in creating new AEM Edge Delivery blocks or modifying existing ones, ensuring consistent structure, JavaScript decoration, CSS styling, and alignment with Content Driven Development (CDD) principles.

Core Features & Use Cases

  • Block scaffolding: Create new block directories with standard files and naming conventions.
  • Decoration & styling: Implement block decoration via JavaScript and apply scoped CSS.
  • Content-driven workflow: Validate prerequisites (test content, content models) and reuse patterns from similar blocks.
  • Testing and documentation: Outline testing strategies and ensure documentation for developers and authors is maintained.

Use Case: A developer needs to add a new block for a product listing and wants to follow the standard process with the right file structure, code patterns, and tests.

Quick Start

Use this skill to scaffold a new AEM Edge Delivery block by defining its structure, adding a decorate.js, and wiring up CSS according to the project guidelines.

Frequently Asked Questions about Building Blocks

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I scaffold a new AEM Edge Delivery block?

Scaffolding an AEM Edge Delivery block involves creating a standard directory structure with a decorate.js file for JavaScript decoration and scoped CSS. This skill enforces standard file structures, naming conventions, and CDD-aligned guidelines to ensure consistency across new block development workflows.

What is Content Driven Development for AEM blocks?

Content Driven Development (CDD) for AEM blocks is a workflow validating prerequisites like test content and content models before implementation. This skill enforces CDD principles by validating content models and reusing established patterns during block structure creation and modification.

How do I add JavaScript decoration and CSS styling to an AEM block?

Adding JavaScript decoration and CSS styling to an AEM block requires implementing a decorate.js file and applying scoped CSS. This skill guides the decoration process by enforcing standardized guidelines for JavaScript decoration patterns and CSS styling within the block directory.

Does AEM Edge Delivery block development require specific folder structures?

Yes, AEM Edge Delivery block development requires specific folder structures including optional scripts, references, and assets directories governed by SKILL.md frontmatter. This skill enforces these standardized directory structures and frontmatter requirements during block scaffolding.

What is the best way to validate content models for AEM blocks?

Validating content models for AEM blocks is best achieved through Content Driven Development workflows that verify test content and content models before implementation. This skill validates content models during block creation and modification to ensure alignment with CDD principles and pattern reuse.

How do I document and test AEM Edge Delivery blocks?

Documenting and testing AEM Edge Delivery blocks involves outlining testing strategies and maintaining documentation for both developers and authors. This skill enforces standardized testing strategies and documentation guidelines as integral components of the block development workflow.