htmx-skill
htmx 문서 가져오기
정확한 htmx 구문과 동작 문서가 필요합니다. 이 스킬은 속성, 이벤트, API, 확장 기능 및 예제를 포함한 포괄적인 htmx 레퍼런스를 제공하여 현대적 웹 애플리케이션 구축을 도와줍니다.
Die Skill-ZIP herunterladen
In Claude hochladen
Gehe zu Einstellungen → Fähigkeiten → Skills → Skill hochladen
Einschalten und loslegen
Teste es
Verwendung von "htmx-skill". How do I use hx-get to load content on click?
Erwartetes Ergebnis:
- The hx-get attribute issues a GET request and swaps the response into the DOM.
- Example: <button hx-get="/example" hx-target="#result">Load</button>
- This loads content from /example and puts it in the element with id 'result'.
- Common options: hx-trigger (what event starts the request), hx-swap (how to insert content), hx-indicator (show loading state).
Verwendung von "htmx-skill". What does hx-boost do?
Erwartetes Ergebnis:
- The hx-boost attribute converts anchors and forms into AJAX requests.
- It maintains graceful fallback for users without JavaScript enabled.
- For forms, the target is the body and innerHTML swap is used by default.
- Use hx-push-url attribute if you want URLs pushed to history.
Sicherheitsaudit
Niedriges RisikoThis is a pure documentation/reference skill containing markdown files and a build script. The 2454 static findings are 99%+ false positives. The 'Ruby/shell backtick execution' findings are markdown code formatting. 'Weak cryptographic algorithm' findings are regex false positives from documentation text. Network/filesystem operations are for downloading documentation from GitHub. No malicious patterns detected.
Risikofaktoren
🌐 Netzwerkzugriff (2)
📁 Dateisystemzugriff (2)
Qualitätsbewertung
Was du bauen kannst
동적 동작 추가
JavaScript를 작성하지 않고 HTML 요소에 AJAX 기능을 추가하기 위한 htmx 속성을 조회합니다.
반응형 UI 구축
서버 기반 업데이트, 리다이렉트 및 이벤트 트리거를 구현하기 위한 응답 헤더를 참조합니다.
확장 기능 통합
애플리케이션에 실시간 기능을 추가하기 위한 SSE 및 WebSocket 확장 기능 문서를 찾습니다.
Probiere diese Prompts
How do I use hx-post to submit a form and swap the response into a div?
What events fire during an htmx request and what properties do they include?
How do I use HX-Location to redirect without a full page reload?
Show me how to use the SSE extension to update content from server-sent events.
Bewährte Verfahren
- 가장 구체적인 페이지로 시작하여 질문에 답하세요 - 일반 가이드보다 속성 문서를 우선하세요.
- 구현 전에 참조된 파일을 열어 세부 사항을 확인하세요. 설명이 간략할 수 있습니다.
- 프로그래밍 방식으로 htmx를 제어해야 할 때는 api.md에서 JavaScript API 메서드를 확인하세요.
Vermeiden
- 복잡한 클라이언트 사이드 상태 관리에 htmx를 사용하지 마세요 - 서버 기반 UI에 설계되었습니다.
- 유효성 검사 오류 처리를 잊지 마세요 - hx-validate와 HTML5 검증 API를 사용하세요.
- hx-swap 타이밍 옵션을 간과하지 마세요 - 부적절한 스왑 설정으로 깜빡임이나 포커스 손실이 발생할 수 있습니다.