From product-tools
Expert on Wave Terminal, Tsunami framework, and Go backend patterns for multi-frontend UI architectures. Use when architecting applications that integrate with Wave Terminal, deciding between Tsunami VDOM vs traditional web, or designing Go backends serving multiple frontend types.
How this skill is triggered — by the user, by Claude, or both
Slash command
/product-tools:wave-ui-architectThe summary Claude sees in its skill listing — used to decide when to auto-load this skill
Expert on Wave Terminal integration, Tsunami framework internals, and Go backend architecture for applications that work across multiple frontend surfaces (Wave widgets, standalone web apps, mobile).
Expert on Wave Terminal integration, Tsunami framework internals, and Go backend architecture for applications that work across multiple frontend surfaces (Wave widgets, standalone web apps, mobile).
Wave Terminal does NOT require Tsunami widgets. It has native WebView support:
{
"my-widget": {
"icon": "zap",
"label": "My Widget",
"blockdef": {
"meta": {
"view": "web",
"url": "http://localhost:8765",
"web:hidenav": true
}
}
}
}
Standard web apps can integrate with Wave without Tsunami-specific code.
| Question | If Yes | If No |
|---|---|---|
| Wave Terminal is primary interface? | Consider Tsunami | Traditional web |
| Team knows Go well? | Tsunami viable | Traditional web |
| Need React ecosystem components? | Traditional web | Tsunami can work |
| Static deployment required? | Traditional web | Both work |
| Deep Wave integration needed? | Tsunami | WebView is fine |
Go Backend (Single Binary)
- Core logic, API endpoints, embedded React build (embed.FS)
| HTTP + SSE
React Frontend (Standard SPA)
- shadcn/ui, Tailwind, Jotai, Vite build
| |
Wave WebView Browser/Mobile
Go Backend: gorilla/mux or chi, embed.FS, air (hot reload) React Frontend: Vite, shadcn/ui + Tailwind, Jotai (atomic state) Wave Terminal: wsh CLI, tsunami run --open, ~/.config/waveterm/
| Aspect | Traditional Web | Tsunami VDOM |
|---|---|---|
| Go control | Backend only | Full stack |
| React ecosystem | Full access | Limited |
| Wave integration | WebView | Native |
| Deployment | Flexible | Go binary required |
| Complexity | Low | Medium |
npx claudepluginhub chazmaniandinkle/skills --plugin product-toolsProvides UI/UX resources: 50+ styles, color palettes, font pairings, guidelines, charts for web/mobile across React, Next.js, Vue, Svelte, Tailwind, React Native, Flutter. Aids planning, building, reviewing interfaces.
Fetches up-to-date documentation from Context7 for libraries and frameworks like React, Next.js, Prisma. Use for setup questions, API references, and code examples.