Stats
Actions
Tags
Help us improve
Share bugs, ideas, or general feedback.
From go-web
Guides templUI component setup in Go templ apps including dropdowns, dialogs, tabs, toasts; Script() configuration, JS interpolation in handlers, non-responsive fixes, HTML-to-templ conversion, and HTMX/Alpine.js integration.
npx claudepluginhub gopherguides/gopher-ai --plugin go-webHow this skill is triggered — by the user, by Claude, or both
Slash command
/go-web:templuiThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Apply templUI patterns and HTMX/Alpine.js best practices when building Go/Templ web applications.
templ templating: syntax, components, attributes, styling, and JavaScript integration. Invoke when task involves any interaction with templ — writing .templ files, creating components, composing templates, testing rendered output, or understanding templ syntax.
Integrates Tambo into existing React/Next.js/Vite apps: detects tech stack, installs @tambo-ai/react and Zod, wires TamboProvider, registers components with Zod schemas, adds chat UI.
Share bugs, ideas, or general feedback.
Apply templUI patterns and HTMX/Alpine.js best practices when building Go/Templ web applications.
| Tool | Purpose | Use For |
|---|---|---|
| HTMX | Server-driven interactions | AJAX requests, form submissions, partial page updates, live search |
| Alpine.js | Client-side state & reactivity | Toggles, animations, client-side filtering, transitions, local state |
| templUI | Pre-built UI components | Dropdowns, dialogs, tabs, sidebars (uses vanilla JS via Script() templates) |
Note: templUI components use vanilla JavaScript (not Alpine.js) via Script() templates.
Read the relevant file for detailed patterns, code examples, and troubleshooting:
htmx-alpine-integration.md — HTMX + Alpine.js IntegrationWhen to use HTMX vs Alpine vs combined. Key integration patterns: Alpine-Morph extension for state preservation across swaps, htmx.process() for Alpine conditionals, triggering HTMX from Alpine.
templ-interpolation.md — CRITICAL: Templ Interpolation in JavaScriptGo expressions { value } do NOT interpolate inside <script> tags. Five patterns to solve this:
data-* attrs + this.dataset{{ value }} inside <script> tagstempl.JSONScriptIncludes when-to-use table and common mistakes.
templui-cli.md — templUI CLI ToolInstall, init, add components, force-update, list available. Always use CLI to add/update components — manual copies miss Script() templates.
script-templates.md — Script() Templates (REQUIRED)Components with JavaScript need Script() calls in base layout <head>. Lists all Script() imports (popover, dropdown, dialog, accordion, tabs, carousel, toast, clipboard), component dependency table, and troubleshooting for non-working components.
conversion-and-audit.md — Converting Sites & AuditingConverting HTML/React/Vue to Go/Templ: process, syntax mapping, package structure. Templ syntax quick reference (props, conditionals, loops, composition). Audit checklist for Script() calls, CLI installation, consistency, dark mode, responsive. Import patterns and troubleshooting guide. Resource links for templUI, HTMX+Alpine, and templ docs.