ai-elements-workflow
✓이 기술은 Vercel AI Elements 및 React Flow를 사용하여 워크플로 시각화를 구축하기 위한 지침을 제공합니다. Next.js 애플리케이션에서 대화형 노드 기반 인터페이스, 워크플로 다이어그램 또는 프로세스 흐름 시각화를 구현할 때 사용해야 합니다. 캔버스, 노드, 가장자리, 연결, 컨트롤, 패널 및 도구 모음 구성 요소를 다룹니다.
SKILL.md
This skill provides comprehensive guidance for building workflow visualizations using Vercel AI Elements with React Flow.
Use animated for active paths and temporary for conditional/error paths:
| Custom Node Components | Use NodeHeader, NodeTitle, NodeDescription, NodeContent, NodeFooter for structured layouts | | Node Toolbars | Attach contextual actions to nodes via Toolbar component | | Handle Configuration | Control connections with handles: { target: boolean, source: boolean } |
이 기술은 Vercel AI Elements 및 React Flow를 사용하여 워크플로 시각화를 구축하기 위한 지침을 제공합니다. Next.js 애플리케이션에서 대화형 노드 기반 인터페이스, 워크플로 다이어그램 또는 프로세스 흐름 시각화를 구현할 때 사용해야 합니다. 캔버스, 노드, 가장자리, 연결, 컨트롤, 패널 및 도구 모음 구성 요소를 다룹니다. 출처: sstobo/convex-skills.
인용 가능한 정보
AI/검색 인용용 안정적인 필드와 명령어.
- 설치 명령어
npx skills add https://github.com/sstobo/convex-skills --skill ai-elements-workflow- 카테고리
- >_생산성
- 인증됨
- ✓
- 최초 등록
- 2026-02-01
- 업데이트
- 2026-02-18
빠른 답변
ai-elements-workflow이란?
이 기술은 Vercel AI Elements 및 React Flow를 사용하여 워크플로 시각화를 구축하기 위한 지침을 제공합니다. Next.js 애플리케이션에서 대화형 노드 기반 인터페이스, 워크플로 다이어그램 또는 프로세스 흐름 시각화를 구현할 때 사용해야 합니다. 캔버스, 노드, 가장자리, 연결, 컨트롤, 패널 및 도구 모음 구성 요소를 다룹니다. 출처: sstobo/convex-skills.
ai-elements-workflow 설치 방법은?
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/sstobo/convex-skills --skill ai-elements-workflow 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다
소스 저장소는 어디인가요?
https://github.com/sstobo/convex-skills
상세
- 카테고리
- >_생산성
- 출처
- skills.sh
- 최초 등록
- 2026-02-01