TypeScript, Tailwind CSS 및 Zustand 상태 관리를 사용하여 모범 사례에 따라 React 구성 요소를 생성합니다. 사용자가 React 컴포넌트, UI 요소 생성을 요청하거나 컴포넌트 생성을 언급할 때 이 스킬을 사용하세요. Zustand 통합을 통해 기본 구성 요소, 양식, 목록, 카드, 버튼, 모달 및 상태 저장 구성 요소를 포함한 일반적인 구성 요소 패턴을 지원합니다.
명령줄에서 react-component-generator AI 스킬을 개발 환경에 빠르게 설치
출처: smallnest/langgraphgo.
This skill provides templates and best practices for generating high-quality React components using TypeScript, Tailwind CSS, and Zustand for state management.
Generate production-ready React components that follow industry best practices and maintain consistency across the codebase. The skill includes pre-built templates for common component patterns and comprehensive best practices documentation.
The skill provides the following templates in the assets/ directory:
TypeScript, Tailwind CSS 및 Zustand 상태 관리를 사용하여 모범 사례에 따라 React 구성 요소를 생성합니다. 사용자가 React 컴포넌트, UI 요소 생성을 요청하거나 컴포넌트 생성을 언급할 때 이 스킬을 사용하세요. Zustand 통합을 통해 기본 구성 요소, 양식, 목록, 카드, 버튼, 모달 및 상태 저장 구성 요소를 포함한 일반적인 구성 요소 패턴을 지원합니다. 출처: smallnest/langgraphgo.
AI/검색 인용용 안정적인 필드와 명령어.
npx skills add https://github.com/smallnest/langgraphgo --skill react-component-generatorTypeScript, Tailwind CSS 및 Zustand 상태 관리를 사용하여 모범 사례에 따라 React 구성 요소를 생성합니다. 사용자가 React 컴포넌트, UI 요소 생성을 요청하거나 컴포넌트 생성을 언급할 때 이 스킬을 사용하세요. Zustand 통합을 통해 기본 구성 요소, 양식, 목록, 카드, 버튼, 모달 및 상태 저장 구성 요소를 포함한 일반적인 구성 요소 패턴을 지원합니다. 출처: smallnest/langgraphgo.
터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/smallnest/langgraphgo --skill react-component-generator 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code, Cursor, OpenClaw에서 사용할 수 있습니다
https://github.com/smallnest/langgraphgo