elbwalker

understanding-sources

@elbwalker/understanding-sources
elbwalker
309
16 forks
Updated 1/6/2026
View on GitHub

Use when working with sources, understanding event capture, or learning about the push interface. Covers browser, dataLayer, and server source patterns.

Installation

$skills install @elbwalker/understanding-sources
Claude Code
Cursor
Copilot
Codex
Antigravity

Details

Pathskills/understanding-sources/SKILL.md
Branchmain
Scoped Name@elbwalker/understanding-sources

Usage

After installing, this skill will be available to your AI coding assistant.

Verify installation:

skills list

Skill Instructions


name: understanding-sources description: Use when working with sources, understanding event capture, or learning about the push interface. Covers browser, dataLayer, and server source patterns.

Understanding walkerOS Sources

Overview

Sources capture events from the external world (browser DOM, dataLayer, HTTP requests, cloud functions) and feed them to the collector.

Core principle: Sources capture. They don't process or deliver—that's collector and destinations.

Source Interface

See packages/core/src/types/source.ts for canonical interface.

MethodPurpose
push(input)Receive external input, emit events

Push Signatures by Type

Source TypeSignatureExample
Cloud Functionpush(req, res) → Promise<void>HTTP handler
Browserpush(event, data) → Promise<void>DOM events
DataLayerpush(event, data) → Promise<void>GTM-style

Key insight: Source push IS the handler. No wrappers needed.

// Direct deployment
http('handler', source.push);

Source Paths

TypePathExamples
Webpackages/web/sources/browser, dataLayer
Serverpackages/server/sources/gcp

Browser Source

The browser source captures events from DOM using data attributes.

<button data-elb="product" data-elb-product="id:P123;name:Laptop">
  <span data-elbaction="click">Add to Cart</span>
</button>

See packages/web/sources/browser/ for implementation.

DataLayer Source

Captures events from a GTM-style dataLayer array.

window.dataLayer.push({
  event: 'product view',
  product: { id: 'P123', name: 'Laptop' },
});

See packages/web/sources/dataLayer/ for implementation.

Server Sources

Handle HTTP requests in cloud functions.

// GCP Cloud Function
export const handler = source.push;

See packages/server/sources/gcp/ for implementation.

Related

Skills:

Source Files:

Package READMEs:

Documentation: