skills.rest
brianium
brianiumCOMMUNITY
Explore all skills by this author →
GitHub

hiccup-component

Develop hiccup UI components with alias-first, REPL-driven workflows.

Updated Jan 19, 2026
Search Tags:#UI#component#Clojure#REPL#live-preview#hiccup#alias-first
One-click install
npx skills add https://github.com/brianium/tsain --skill hiccup-component
Or copy as Structured Prompt for Agent▼
Please help me install this Agent Skill.
Skill: hiccup-component
Source: https://github.com/brianium/tsain/tree/main/.claude/skills/hiccup-component
Command: npx skills add https://github.com/brianium/tsain --skill hiccup-component

SYSTEM DOCUMENTATION & REQUIREMENTS

What problem does it solve?

Develop hiccup components with an alias-first, REPL-driven workflow, keeping component structure in a UI namespace and lean invocations in a components library to accelerate UI iteration and collaboration.

Core Features & Use Cases

  • Alias-first design: define component structure in a production namespace as chassis aliases and persist lean invocations in components.edn.
  • Live preview & styling: iterate with real-time previews and CSS styling to validate visuals during development.
  • Spec-driven workflow: follow a structured path from specs to implementation, enabling repeatable commits to the library.

Quick Start

Define a chassis alias in your UI namespace, preview via dispatch calls, iterate on structure and CSS, then commit the lean alias form to the library and reload to verify.

Frequently Asked Questions about hiccup-component

High-intent search queries and answers about installing and using this skill.

FAQPage Schema
How do I iterate on Clojure hiccup UI components with live previews?▼

To iterate on hiccup UI components with live previews, define a chassis alias in your UI namespace, dispatch preview calls, and validate real-time CSS styling before committing lean invocations to a components.edn library.

What is an alias-first workflow for REPL-driven UI component development?▼

An alias-first workflow separates component structure by defining chassis aliases in a production UI namespace, while persisting lean invocations in a components.edn library to accelerate UI iteration and collaboration.

How do I structure hiccup component development using a spec-driven workflow?▼

Structure hiccup component development by following a spec-driven path from specifications to implementation, enabling repeatable commits of lean alias forms to the components library for verification.

Do I need a specific environment to enable live previews for Clojure hiccup components?▼

Live previews for Clojure hiccup components require a tsain-enabled environment configured with a tsain.edn file to coordinate previews, commits, and iterations alongside a components.edn library.

What's the best way to manage CSS styling during hiccup component iteration?▼

Manage CSS styling during hiccup component iteration by using real-time live previews to validate visuals, adjusting structure and styles before committing the finalized lean alias form to the library.

Why keep hiccup component structure in a UI namespace instead of the components library?▼

Keeping hiccup component structure in a UI namespace maintains production code integrity, while the components.edn library stores lean invocations, ensuring a clean separation for accelerated iteration.

Related Skills

Explore More Software Engineering Skills→
brianiumbrianium

tsain

Drive REPL-based Clojure UI component development with alias-based workflows.

Community
Intermediate
day8day8
19

re-frame-pair

Trace re-frame dispatches and inspect live runtime state via shadow-cljs nREPL.

Official
Advanced
manuelbrandner85manuelbrandner85

flutter-add-widget-preview

Integrate interactive widget previews into Flutter projects with custom annotations.

Community
Intermediate
MicrockMicrock
322

clojure-write

Write and refactor Clojure and ClojureScript code using REPL-driven workflows.

Community
Advanced