How does the decorate function work in this skill?

The decorate function is the standard entry point for EDS blocks, receiving the block element and transforming it from a raw table structure into a functional component.

What is an EDS Block?

An EDS block is a specialized UI component in Adobe Edge Delivery Services that combines content authored in Google Docs or Sharepoint with custom CSS and JavaScript for rendering.

What is the recommended file structure for an EDS block?

A standard block should include a .js file for logic, a .css file for styles, a README.md for documentation, and an EXAMPLE.md showing the expected Google Docs structure.

Why are reserved class names important in EDS development?

EDS automatically appends -container and -wrapper suffixes to blocks; using these in your custom code can cause severe CSS conflicts and break page layouts.

Adobe EDS Block Developer

Name: Adobe EDS Block Developer
Author: ddttom

byddttom

コンテンツ管理

Accelerates Adobe Edge Delivery Services (EDS) development by providing standardized patterns for block decoration, content extraction, and vanilla JavaScript implementation.

概要

This skill provides a comprehensive framework for building high-performance web components within the Adobe Edge Delivery Services ecosystem. It enforces Content Driven Development principles, ensuring that blocks correctly interpret Google Docs structures while maintaining strict architectural standards. By guiding developers through the decorate function pattern, configuration object management, and CSS naming safeguards, it helps prevent common production bugs and ensures maintainable, scalable frontend code for EDS-powered sites.

主な機能

Provides structural guidance for Google Docs table integration and content extraction
0 GitHub stars
Standardizes the decorate function pattern for consistent DOM manipulation
Guides developers through metadata overrides and dependency injection patterns
Enforces EDS-specific CSS naming conventions to prevent reserved class conflicts
Implements robust configuration object architecture with global constant separation

ユースケース

Migrating existing frontend components into the EDS block structure
Building custom UI components (blocks) for Adobe Edge Delivery Services websites
Debugging and refactoring complex block logic for better performance and maintainability

概要

主な機能

Provides structural guidance for Google Docs table integration and content extraction
0 GitHub stars
Standardizes the decorate function pattern for consistent DOM manipulation
Guides developers through metadata overrides and dependency injection patterns
Enforces EDS-specific CSS naming conventions to prevent reserved class conflicts
Implements robust configuration object architecture with global constant separation

ユースケース

Migrating existing frontend components into the EDS block structure
Building custom UI components (blocks) for Adobe Edge Delivery Services websites
Debugging and refactoring complex block logic for better performance and maintainability