implementing-search-filter

SKILL.md

Implement search and filter interfaces with comprehensive frontend components and backend query optimization.

This skill provides production-ready patterns for implementing search and filtering functionality across the full stack. It covers React/TypeScript components for the frontend (search inputs, filter UIs, autocomplete) and Python patterns for the backend (SQLAlchemy queries, Elasticsearch integration, API design). The skill emphasizes performance optimization, accessibility, and user experience.

フロントエンド (React/TypeScript) とバックエンド (Python) の両方に、デバウンス、クエリ管理、データベース統合を備えた検索およびフィルター インターフェイスを実装します。検索機能の追加、フィルター UI の構築、ファセット検索の実装、または検索パフォーマンスの最適化を行うときに使用します。 ソース: ancoleman/ai-design-components。

ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/ancoleman/ai-design-components --skill implementing-search-filter インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code や Cursor で使用できるようになります

原文を見る