·react-state-driven-ui
*

react-state-driven-ui

lucascmelo/agent-skills

리듀서 + 이벤트를 사용하여 명시적인 상태 전환을 투영하는 React UI를 만듭니다. 다단계 양식, 비동기 작업, 구성 요소 간 상태, 탐색 통합, 실시간 업데이트 또는 복잡한 유효성 검사를 작성할 때 사용합니다. 명시적인 상태 전환과 격리된 부작용을 통해 타이밍에 따른 버그를 제거합니다.

4설치·0트렌드·@lucascmelo

설치

$npx skills add https://github.com/lucascmelo/agent-skills --skill react-state-driven-ui

SKILL.md

Build predictable, testable React applications by treating UI as a pure projection of explicit state. This architectural pattern eliminates timing-dependent bugs, reduces cognitive overhead, and makes complex workflows manageable through clear state transitions and isolated side effects.

When to apply Use this skill when building features that require:

Technical approach Use this skill to design and implement UI behavior as a pure projection of state. Model behavior with reducer + events. Isolate side effects in React Query mutation callbacks.

리듀서 + 이벤트를 사용하여 명시적인 상태 전환을 투영하는 React UI를 만듭니다. 다단계 양식, 비동기 작업, 구성 요소 간 상태, 탐색 통합, 실시간 업데이트 또는 복잡한 유효성 검사를 작성할 때 사용합니다. 명시적인 상태 전환과 격리된 부작용을 통해 타이밍에 따른 버그를 제거합니다. 출처: lucascmelo/agent-skills.

원본 보기

인용 가능한 정보

AI/검색 인용용 안정적인 필드와 명령어.

설치 명령어
npx skills add https://github.com/lucascmelo/agent-skills --skill react-state-driven-ui
카테고리
*크리에이티브
인증됨
최초 등록
2026-02-06
업데이트
2026-02-18

빠른 답변

react-state-driven-ui이란?

리듀서 + 이벤트를 사용하여 명시적인 상태 전환을 투영하는 React UI를 만듭니다. 다단계 양식, 비동기 작업, 구성 요소 간 상태, 탐색 통합, 실시간 업데이트 또는 복잡한 유효성 검사를 작성할 때 사용합니다. 명시적인 상태 전환과 격리된 부작용을 통해 타이밍에 따른 버그를 제거합니다. 출처: lucascmelo/agent-skills.

react-state-driven-ui 설치 방법은?

터미널 또는 명령줄 도구(Terminal, iTerm, Windows Terminal 등)를 엽니다 이 명령어를 복사하여 실행합니다: npx skills add https://github.com/lucascmelo/agent-skills --skill react-state-driven-ui 설치 후 스킬은 자동으로 AI 코딩 환경에 설정되어 Claude Code나 Cursor에서 사용할 수 있습니다

소스 저장소는 어디인가요?

https://github.com/lucascmelo/agent-skills

상세

카테고리
*크리에이티브
출처
skills.sh
최초 등록
2026-02-06