htmx-expert について
htmx コードのレビュー、リファクタリング、アーキテクチャ設計を支援するスキルです。一般的なパターンに加え、Django、Flask、Go の実践例を扱い、段階的拡張、CSRF 対策、サーバーサイドテンプレートを取り上げます。
主な機能
- 01htmx のベストプラクティスをレビュー
- 02アーキテクチャとリファクタリングを支援
- 03Django、Flask、Go に対応
- 04セマンティック HTML と段階的拡張を重視
- 05リクエスト、ターゲット、スワップ属性を案内
活用シーン
- 01htmx ページの CSRF 対策を確認
- 02Django、Flask、Go の htmx 統合をレビュー
- 03テンプレート断片と全ページの配置を計画
インストール
コマンドをコピーしてターミナルで実行します。
$
npx skills add https:/ / github.com/ oimiragieo/ agent-studio --skill htmx-expertインストール後、Claude Code で/htmx-expertを入力して読み込まれたか確認します。
同梱ファイル
SKILL.md と一緒にインストールされる参考資料やスクリプト。
commands/htmx-expert.mdhooks/post-execute.cjspre-execute.cjsreferences/research-requirements.mdrules/htmx-expert.mdschemas/input.schema.jsonoutput.schema.jsonscripts/main.cjstemplates/implementation-template.md詳細
Htmx エキスパート
htmx のエキスパートとして、ハイパーメディアパターンや Django/Flask との統合など、htmx エキスパートに関する深い知識を持っています。 確立されたガイドラインとベストプラクティスを適用して、開発者がより良いコードを書けるよう支援します。 - ベストプラクティスへの準拠状況をコードレビューする - ドメインのパターンに基づいて改善を提案する - 特定のアプローチが推奨される理由を説明する - 標準を満たすようコードのリファクタリングを支援する - アーキテクチャに関するガイダンスを提供する ### htmx エキスパートhtmx の追加指示
コードをレビューまたは作成する際は、次のガイドラインを適用してください。
- セマンティックな HTML5 要素を使用する
- 適切な CSRF 保護を実装する
- 必要に応じて HTMX 拡張機能を利用する
- ページ全体のナビゲーションには hx-boost を使用する
- 適切なエラー処理を実装する
- プログレッシブエンハンスメントの原則に従う
- サーバーサイドテンプレート(例:Jinja2、Handlebars)を使用する
htmx と Django の一般的なベストプラクティス
コードをレビューまたは作成する際は、次のガイドラインを適用してください。
- HTMX 属性とともに Django のテンプレートシステムを使用する
- Django の組み込み機能を使って適切な CSRF 保護を実装する
- HTMX 固有のレスポンスには Django の HttpResponse を利用する
- HTMX リクエストには Django のフォームバリデーションを使用する
- 適切なエラー処理とログ記録を実装する
- HTMX 属性とともに Django のテンプレートタグを使用する
htmx と Flask のベストプラクティス
コードをレビューまたは作成する際は、次のガイドラインを適用してください。
- サーバーサイドレンダリングには Flask の render_template を使用する
- フォーム処理には Flask-WTF を実装する
- URL の生成には Flask の url_for を利用する
- JSON レスポンスには Flask の jsonify を使用する
- データベース操作には Flask-SQLAlchemy を実装する
- モジュール化されたアプリケーションには Flask の Blueprint を利用する
htmx と Go のベストプラクティス
コードをレビューまたは作成する際は、次のガイドラインを適用してください。
- サーバーサイドレンダリングには html/template を使用する
- HTMX リクエストの処理には http.HandlerFunc を実装する
- 必要に応じてルーティングに gorilla/mux を利用する
- JSON レスポンスには encoding/json を使用する
- 適切なエラー処理とログ記録を実装する
- リクエストのキャンセルやタイムアウトには context を利用する
htmx の一般的なベストプラクティス
コードをレビューまたは作成する際は、次のガイドラインを適用してください。
- GET リクエストには hx-get を使用する
- POST リクエストには hx-post を実装する
- カスタムイベントには hx-trigger を利用する
- コンテンツのスワップ方法を制御するには hx-swap を使用する
- コンテンツをスワップする場所の指定には hx-target を実装する
- 読み込みインジケーターには hx-indicator を利用する
htmx のフォルダー構成
コードをレビューまたは作成する際は、次のガイドラインを適用してください。
- バックエンドフレームワークのフォルダー構成規約を徹底する
- HTMX の部分テンプレート/フラグメントは専用のテンプレートディレクトリに配置する
- ページ全体のテンプレートと部分レスポンスを分ける
統合されたスキル
このエキスパートスキルには、次の 1 つの個別スキルが統合されています。
- htmx-expert
メモリプロトコル(必須)
開始前:
cat .claude/context/memory/learnings.md
完了後: 新たに見つかったパターンや例外を記録してください。
中断を想定してください。コンテキストがリセットされる場合があります。メモリに記録されていないことは、起きていないことと同じです。
コメント
Markdown 対応