Hotwire Club Skills plugin
Six Hotwire skills for Claude Code: Turbo Frames and Streams, forms, pagination, media and Stimulus controllers with examples
- 153 ★ on the repository
- Last commit
- MIT
Minimal access
Why this level
- The skills hold reference material and run nothing
Install
- Works in
In your terminal, with SkillFoxx CLI
npx skillfoxx add plugins/hotwire-club-skillsDetects the agents on your machine, shows the access level and pins the version.
Other ways to install
Access and checks
How we reviewMinimal accessThe tool runs nothing and makes no network calls.
- The skills hold reference material and run nothing
This is third-party code. Review the repository files before installing.
What it does
Hotwire Club Skills is a set of six topic skills for Hotwire (Turbo and Stimulus) extracted from the Hotwire Club knowledge base. Each skill has a SKILL.md, agents/openai.yaml settings and a references folder of worked examples. hwc-ux-feedback covers loading indicators, progress, optimistic UI and smooth transitions. hwc-forms-validation handles form submission, inline editing, live validation, typeahead, modals and external form controls. hwc-navigation-content deals with pagination, lazy loading, search, filtering, tabs and the Turbo Drive cache lifecycle. hwc-realtime-streaming covers WebSockets, live data, custom Turbo Streams actions and state sync. hwc-media-content works with images, video, audio, file uploads and third-party libraries. hwc-stimulus-fundamentals covers Stimulus controllers: lifecycle hooks, values, targets, outlets and events. The scripts/sync-references.rb script refreshes the reference material from the knowledge base.
Who it is for. Developers on Rails and other backends who build interfaces with Turbo and Stimulus and write code with an AI agent.
Good fit when
- A form with live validation and typeahead on Turbo Frames
- Infinite scroll, lazy loading and tabs with no page reload
- Live updates through Turbo Streams and WebSockets
- A Stimulus controller with targets, values and outlets
Not a fit when
- A React or Vue project with no Hotwire: the skills are about another approach
- You need a full Turbo API reference: the skills give patterns, not a reference
- You want a general Rails skill: the set covers Hotwire only
Example request
Use hwc-forms-validation and build a form with live email validation using Turbo FramesLimitations
The material comes from the Hotwire Club knowledge base, and part of the up-to-date lessons is available through the author's paid Patreon. The skills give patterns and examples, so check compatibility with your Turbo and Stimulus versions yourself. The references are compiled from lessons across 2023 to 2026, so check the APIs and techniques in older examples against the Turbo and Stimulus versions in your project. Examples in references use Rails and plain JavaScript in various places, so some code has to be ported to your backend.
How to disable. Run npx skills remove with the skill name (for example hwc-ux-feedback) or delete the hwc-* folders from ~/.claude/skills.
FAQ
Which topics do the skills cover?
Six: UX feedback, forms and validation, navigation and content, real-time and streaming, media, and Stimulus fundamentals. Names start with hwc-.
How do I install a single skill?
Add --skill, for example npx skills add TheHotwireClub/hotwire_club-skills --skill hwc-ux-feedback. The --list flag shows what is available.
Do the skills work in Cursor?
Yes, in any editor that reads the skill format: npx skills add accepts several agents through a repeated -a flag. For manual setup copy the folders from skills/ into your editor skills directory.
What is inside each skill?
A SKILL.md file, agents/openai.yaml settings and a references folder of worked examples for the topic, with its own INDEX.md.
How do I install the skills by hand in Claude Desktop?
Copy or symlink the skills/hwc-* folders into ~/.claude/skills (on Windows %USERPROFILE%\.claude\skills) and restart Claude Desktop.
Discussion
No questions or reviews yet.
Related
Plugins35 skills for Cursor, Claude and Codex: design systems from HTML and mocks, image generation, plan interviews and handoff.
julianromli/ai-skills
ai-skills
A collection of 31 skills for Claude Code and other agents: interfaces, React, Postgres, code review, SEO and browser automation
A skill for Claude Code, Cursor and Codex that adds vibration feedback to the mobile web with the web-haptics library, following Apple HIG
A Claude Code skill collection for copywriting, advertising, SEO and interface design: Ogilvy, editing, rules and CSS techniques.
Skills for the Symfony UX frontend stack: Stimulus, Turbo, TwigComponent, LiveComponent, UX Icons and UX Map, with patterns and gotchas
A registry of installable design skills: ready SKILL.md and DESIGN.md files with tokens, component rules and accessibility for different styles
Comparison with similar tools
Cards that share the main search query, and how they differ.
| Tool | Official | Repository stars | Main difference |
|---|---|---|---|
| Hotwire Club Skills (this card) | no | 153 | |
| Layered Rails Skills | no | 479 | layered Rails architecture, not Hotwire interface work |
| my-skills by akitaonrails | no | 302 | a personal skill set in which Hotwire is not the focus |
README in short
The README lists six skills with their topics and explains installation through npx skills (including several agents at once), manual setup in Claude Desktop and copying for Cursor and other editors. At the top the author invites support on Patreon.