react-flow-node-ts
React Flow Node
Create React Flow node components following established patterns with proper TypeScript types and store integration.
Quick Start
Copy templates from assets/ and replace placeholders:
{{NodeName}}→ PascalCase component name (e.g.,VideoNode){{nodeType}}→ kebab-case type identifier (e.g.,video-node){{NodeData}}→ Data interface name (e.g.,VideoNodeData)
Templates
- assets/template.tsx - Node component
- assets/types.template.ts - TypeScript definitions
Node Component Pattern
More from involvex/skills
bun-development
Modern JavaScript/TypeScript development with Bun runtime. Covers package management, bundling, testing, and migration from Node.js. Use when working with Bun, optimizing JS/TS development speed, o...
13brainstorming
You MUST use this before any creative work - creating features, building components, adding functionality, or modifying behavior. Explores user intent, requirements and design before implementation.
10frontend-ui-dark-ts
Build dark-themed React applications using Tailwind CSS with custom theming, glassmorphism effects, and Framer Motion animations. Use when creating dashboards, admin panels, or data-rich interfaces with a refined dark aesthetic.
10react-patterns
Modern React patterns and principles. Hooks, composition, performance, TypeScript best practices.
9react-ui-patterns
Modern React UI patterns for loading states, error handling, and data fetching. Use when building UI components, handling async data, or managing UI states.
9canvas-design
Create beautiful visual art in .png and .pdf documents using design philosophy. You should use this skill when the user asks to create a poster, piece of art, design, or other static piece. Create original visual designs, never copying existing artists' work to avoid copyright violations.
9