Skills
.Work. You
Rest

agent-ui-implementer

Official

React/Chakra UI 프론트엔드 구현

Software Engineering#react#code generation#frontend development#component development#ui implementation#chakra ui
Authoraroido
Version1.0.0
Installs0

System Documentation

What problem does it solve?

이 스킬은 승인된 스펙 문서를 기반으로 React/Chakra UI 프론트엔드 컴포넌트, 훅, 라우터를 자동으로 구현하여 개발 생산성을 향상시킵니다.

Core Features & Use Cases

  • 스펙 기반 구현: UI Specification, Data Model, User Interactions를 코드로 변환합니다.
  • 자동화된 폴더 구조 생성: packages/web/src/features/{name}/ 내에 타입, 컴포넌트, 훅, 서비스 등을 포함한 표준화된 폴더 구조를 생성합니다.
  • Chakra UI v3 활용: 최신 Chakra UI 컴포넌트와 모범 사례를 사용하여 UI를 구현합니다.
  • Use Case: 새로운 기능의 프론트엔드 개발 시, 스펙 문서만 제공하면 이 스킬이 기본적인 코드 구조와 컴포넌트 뼈대를 자동으로 생성하여 개발자가 핵심 로직 구현에 집중할 수 있도록 합니다.

Quick Start

Use the agent-ui-implementer skill to implement the UI for the 'user-profile' feature based on the provided specifications.

Dependency Matrix

Required Modules

None required

Components

references

💻 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: agent-ui-implementer
Download link: https://github.com/aroido/vibesmith/archive/main.zip#agent-ui-implementer

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.