How do I install the Hwc Stimulus Fundamentals skill?

Run npx skillmds@latest add thehotwireclub/hwc-stimulus-fundamentals in your terminal (requires Node.js), paste this page's agent-chat prompt into Claude, Cursor, or any MCP-connected agent, or download the SKILL.md file and copy it into your agent's skills directory.

Is Hwc Stimulus Fundamentals safe to use?

This skill has not completed SkillMD's automated safety review yet. SkillMD never runs a skill's scripts for you; review the SKILL.md before installing.

Which AI agents work with Hwc Stimulus Fundamentals?

This skill is tagged as working with Claude Code, Claude.ai, OpenAI Codex. SKILL.md is an open format, so most agents that read a skills directory can load it too.

Is Hwc Stimulus Fundamentals free to use?

Yes. Installing skills from SkillMD is free, and the skill stays under its author's original license.

Who published Hwc Stimulus Fundamentals?

thehotwireclub (@thehotwireclub) published this skill. Their other Agent Skills are listed on their SkillMD profile.

Hwc Stimulus Fundamentals by thehotwireclub

Name: Hwc Stimulus Fundamentals
Author: thehotwireclub

Hwc Stimulus Fundamentals

Cover Stimulus controller fundamentals: lifecycle hooks, values and valueChanged callbacks, targets and target callbacks, outlets, action parameters, keyboard events, and controller architecture patterns. Prefer this skill when the request is primarily about Stimulus APIs and controller design independent of a specific Hotwire domain. Use hwc-forms-validation for form-specific workflows, hwc-navigation-content for Turbo navigation concerns, hwc-realtime-streaming for Turbo Streams/WebSocket patterns, hwc-media-content for media integrations, and hwc-ux-feedback for loading/progress/transition UX patterns.

File contents

Stimulus Fundamentals

Implement robust Stimulus controllers with clear lifecycle and state boundaries.

Core Workflow

Define controller contract first: targets, values, outlets, actions, and expected lifecycle.
Keep state transitions in value callbacks when reactive updates are required.
Guard callbacks that can run before connect() completes.
Use connect()/disconnect() for setup and teardown symmetry.
Isolate DOM event handling from business rules; keep controllers composable.

Guardrails

Prefer declarative action parameters over manual dataset parsing.
Use outlets for controller-to-controller communication instead of private internals.
Keep target callbacks idempotent; account for repeated connect/disconnect cycles.
Use MutationObserver only when DOM-driven reactivity is required.
Feature-detect browser APIs before exposing UI affordances.

Load References Selectively

Open only the file needed for the current request.

Value changed callbacks: references/2023-08-29-stimulus-value-changed-callbacks.md
Keyboard action filters and hotkeys: references/2023-10-24-stimulus-keyboardevent-101.md
MutationObserver-based sorting: references/2023-12-05-stimulus-auto-sorting.md
Outlets API communication: references/2023-12-19-stimulus-outlets-api.md
Target callback orchestration: references/2024-05-07-stimulus-target-callbacks.md
Web Share API integration: references/2025-11-25-stimulus-web-share-api.md
Core Web Vitals and lazy-loading fundamentals: references/2024-06-18-fundamentals-core-web-vitals.md

Use references/INDEX.md for the full catalog.

Escalate to Neighbor Skills

Form-centric behavior: use hwc-forms-validation
Navigation/history/cache with Turbo: use hwc-navigation-content
Turbo Stream/WebSocket orchestration: use hwc-realtime-streaming
Media integrations and playback concerns: use hwc-media-content
UX feedback/transitions/progress concerns: use hwc-ux-feedback

---name: hwc-stimulus-fundamentalsdescription: Cover Stimulus controller fundamentals: lifecycle hooks, values and valueChanged callbacks, targets and target callbacks, outlets, action parameters, keyboard events, and controller architecture patterns. Prefer this skill when the request is primarily about Stimulus APIs and controller design independent of a specific Hotwire domain. Use hwc-forms-validation for form-specific workflows, hwc-navigation-content for Turbo navigation concerns, hwc-realtime-streaming for Turbo Streams/WebSocket patterns, hwc-media-content for media integrations, and hwc-ux-feedback for loading/progress/transition UX patterns.---# Stimulus FundamentalsImplement robust Stimulus controllers with clear lifecycle and state boundaries.## Core Workflow1. Define controller contract first: targets, values, outlets, actions, and expected lifecycle.2. Keep state transitions in value callbacks when reactive updates are required.3. Guard callbacks that can run before `connect()` completes.4. Use `connect()/disconnect()` for setup and teardown symmetry.5. Isolate DOM event handling from business rules; keep controllers composable.## Guardrails- Prefer declarative action parameters over manual dataset parsing.- Use outlets for controller-to-controller communication instead of private internals.- Keep target callbacks idempotent; account for repeated connect/disconnect cycles.- Use MutationObserver only when DOM-driven reactivity is required.- Feature-detect browser APIs before exposing UI affordances.## Load References SelectivelyOpen only the file needed for the current request.- Value changed callbacks: `references/2023-08-29-stimulus-value-changed-callbacks.md`- Keyboard action filters and hotkeys: `references/2023-10-24-stimulus-keyboardevent-101.md`- MutationObserver-based sorting: `references/2023-12-05-stimulus-auto-sorting.md`- Outlets API communication: `references/2023-12-19-stimulus-outlets-api.md`- Target callback orchestration: `references/2024-05-07-stimulus-target-callbacks.md`- Web Share API integration: `references/2025-11-25-stimulus-web-share-api.md`- Core Web Vitals and lazy-loading fundamentals: `references/2024-06-18-fundamentals-core-web-vitals.md`Use `references/INDEX.md` for the full catalog.## Escalate to Neighbor Skills- Form-centric behavior: use `hwc-forms-validation`- Navigation/history/cache with Turbo: use `hwc-navigation-content`- Turbo Stream/WebSocket orchestration: use `hwc-realtime-streaming`- Media integrations and playback concerns: use `hwc-media-content`- UX feedback/transitions/progress concerns: use `hwc-ux-feedback`

Frequently asked questions