Skills
.Work. You
Rest

vhm24-ui-generator

Community

Generate consistent VendHub UI screens end-to-end.

Software Engineering#ui#TypeScript#zustand#generator#tRPC#Drizzle#VendHub
Authorjamsmac
Version1.0.0
Installs0

System Documentation

What problem does it solve?

VendHub OS UI development often involves repetitive boilerplate and inconsistent patterns across frontend and backend layers. This Skill automates the generation of production-ready TypeScript/React screens that adhere to the Warm Brew design system, accelerating delivery and ensuring uniform UX.

Core Features & Use Cases

  • Full-stack screen scaffolding: auto-generates React/TypeScript screens with tRPC routes, Drizzle ORM models, and Zustand stores.
  • Design system compliance: enforces shadcn/ui components, consistent typography, colors, and dark mode support.
  • Spec-driven workflow: relies on an upfront vhm24-ux-spec specification to guide generation and approvals.
  • Use Case: quickly create an admin page, detail view, or modal form for VendHub modules with consistent structure.

Quick Start

Use the vhm24-ui-generator to scaffold a new VendHub screen after validating the spec with vhm24-ux-spec.

Dependency Matrix

Required Modules

None required

Components

assets

💻 Claude Code Installation

Recommended: Let Claude install automatically. Simply copy and paste the text below to Claude Code.

Please help me install this Skill:
Name: vhm24-ui-generator
Download link: https://github.com/jamsmac/VHM24/archive/main.zip#vhm24-ui-generator

Please download this .zip file, extract it, and install it in the .claude/skills/ directory.
View Source Repository

Agent Skills Search Helper

Install a tiny helper to your Agent, search and equip skill from 223,000+ vetted skills library on demand.