mcpField
H
htmx-expert

htmx-expert

github.com/oimiragieo開発4454 回インストール17 週間前に更新
リポジトリ

htmx-expert について

htmx コードのレビュー、リファクタリング、アーキテクチャ設計を支援するスキルです。一般的なパターンに加え、Django、Flask、Go の実践例を扱い、段階的拡張、CSRF 対策、サーバーサイドテンプレートを取り上げます。

主な機能

  1. 01htmx のベストプラクティスをレビュー
  2. 02アーキテクチャとリファクタリングを支援
  3. 03Django、Flask、Go に対応
  4. 04セマンティック HTML と段階的拡張を重視
  5. 05リクエスト、ターゲット、スワップ属性を案内

活用シーン

  1. 01htmx ページの CSRF 対策を確認
  2. 02Django、Flask、Go の htmx 統合をレビュー
  3. 03テンプレート断片と全ページの配置を計画

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/oimiragieo/agent-studio --skill htmx-expert

インストール後、Claude Code で/htmx-expertを入力して読み込まれたか確認します。

同梱ファイル

SKILL.md と一緒にインストールされる参考資料やスクリプト。

commands/
htmx-expert.md
hooks/
post-execute.cjs
pre-execute.cjs
references/
research-requirements.md
rules/
htmx-expert.md
schemas/
input.schema.json
output.schema.json
scripts/
main.cjs
templates/
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 の部分テンプレート/フラグメントは専用のテンプレートディレクトリに配置する
  • ページ全体のテンプレートと部分レスポンスを分ける
使用例: ``` User: "Review this code for htmx best practices" Agent: [Analyzes code against consolidated guidelines and provides specific feedback] ```

統合されたスキル

このエキスパートスキルには、次の 1 つの個別スキルが統合されています。

  • htmx-expert

メモリプロトコル(必須)

開始前:

cat .claude/context/memory/learnings.md

完了後: 新たに見つかったパターンや例外を記録してください。

中断を想定してください。コンテキストがリセットされる場合があります。メモリに記録されていないことは、起きていないことと同じです。

コメント