Stimulus (Symfony UX)

무엇을 해주나

Symfony UX의 Stimulus JS 프레임워크 작업을 Claude가 관례에 맞게 처리하도록 만듭니다.

• data-controller, data-action, data-*-target, data-*-value, data-*-class, data-*-outlet 배선 규칙을 정확히 적용
• 컨트롤러 파일명 규칙(hello_controller.js → data-controller="hello", 하위 디렉터리는 --) 준수
• connect() / disconnect() 생명주기와 정리(cleanup) 원칙, Turbo 내비게이션 호환성 반영
• 키보드 단축키, window/document 전역 이벤트, :prevent 같은 액션 수정자 사용법
• 무거운 라이브러리는 /* stimulusFetch: 'lazy' */로 지연 로딩
• Twig에서 서버 데이터를 값(value)으로 전달하는 방법과 stimulus_controller() 헬퍼 활용
• api.md / patterns.md / gotchas.md 참조 문서로 심화 내용 연결

또한 언제 이 스킬을 쓰지 말아야 하는지도 명시합니다(부분 페이지 갱신은 Turbo, 서버 렌더 반응성은 Live Component, 재사용 템플릿은 Twig Component).

이런 분께 추천

• Symfony + Symfony UX(AssetMapper/Webpack Encore)로 프론트엔드를 만드는 개발자
• Stimulus를 쓰고 있지만 targets/values/outlets 관례가 헷갈리는 분
• 서드파티 JS 라이브러리를 Stimulus 컨트롤러로 감싸야 하는 분

활용 예시

1. "드롭다운 메뉴를 Stimulus로 만들어줘" → 다중 컨트롤러 조합과 data-action="click->dropdown#toggle" 패턴으로 구현
2. "ESC로 닫히는 모달 만들어줘" → keydown.esc@window->modal#close 전역 키보드 액션 적용
3. "Chart.js 차트를 붙여줘" → /* stimulusFetch: 'lazy' */ 지연 로딩 컨트롤러 + Twig에서 데이터를 value로 전달

이 파일의 지시를 읽고 그대로 따라서 나를 도와줘:
https://raw.githubusercontent.com/smnandre/symfony-ux-skills/HEAD/skills/stimulus/SKILL.md

내가 원하는 것: (여기에 하고 싶은 일을 쓰세요)

클로드스킬마트에서 찾은 스킬을 설치해줘.
GitHub 저장소 smnandre/symfony-ux-skills 의 skills/stimulus 폴더를 내 ~/.claude/skills/stimulus/ 에 그대로 복사해줘.
설치가 끝나면 이 스킬로 무엇을 할 수 있는지 한 줄로 알려줘.