タスクに UI コンポーネントの設計または構築が含まれる場合は、積極的に読み込みます。ユーザーが「コンポーネントを構築する」、「フォームを作成する」、「モーダルを追加する」、「レイアウトをデザインする」、または「このページをリファクタリングする」と言うときに使用します。コンポーネントの構成と階層、プロップのデザインと型指定、レンダリングの最適化 (メモ、useMemo、useCallback)、複合コンポーネントのパターン、制御されたフォームと制御されていないフォーム、ファイル構成、および React、Vue、Svelte のアクセシビリティについて説明します。
コマンドラインで component-architecture AI スキルを開発環境にすばやくインストール
ソース: mgd34msu/goodvibes-plugin。
This skill guides you through designing and implementing UI components using GoodVibes precision and analysis tools. Use this workflow when building React, Vue, or Svelte components with proper composition, state management, and performance optimization.
Trigger phrases: "build component", "create UI", "component structure", "render optimization", "state lifting", "component composition".
Before building components, understand existing patterns in the codebase.
タスクに UI コンポーネントの設計または構築が含まれる場合は、積極的に読み込みます。ユーザーが「コンポーネントを構築する」、「フォームを作成する」、「モーダルを追加する」、「レイアウトをデザインする」、または「このページをリファクタリングする」と言うときに使用します。コンポーネントの構成と階層、プロップのデザインと型指定、レンダリングの最適化 (メモ、useMemo、useCallback)、複合コンポーネントのパターン、制御されたフォームと制御されていないフォーム、ファイル構成、および React、Vue、Svelte のアクセシビリティについて説明します。 ソース: mgd34msu/goodvibes-plugin。
AI/検索での引用用の安定したフィールドとコマンド。
npx skills add https://github.com/mgd34msu/goodvibes-plugin --skill component-architectureタスクに UI コンポーネントの設計または構築が含まれる場合は、積極的に読み込みます。ユーザーが「コンポーネントを構築する」、「フォームを作成する」、「モーダルを追加する」、「レイアウトをデザインする」、または「このページをリファクタリングする」と言うときに使用します。コンポーネントの構成と階層、プロップのデザインと型指定、レンダリングの最適化 (メモ、useMemo、useCallback)、複合コンポーネントのパターン、制御されたフォームと制御されていないフォーム、ファイル構成、および React、Vue、Svelte のアクセシビリティについて説明します。 ソース: mgd34msu/goodvibes-plugin。
ターミナルまたはコマンドラインツール（Terminal、iTerm、Windows Terminal など）を開きます このコマンドをコピーして実行します: npx skills add https://github.com/mgd34msu/goodvibes-plugin --skill component-architecture インストール後、スキルは自動的に AI コーディング環境に設定され、Claude Code、Cursor、OpenClaw で使用できるようになります
https://github.com/mgd34msu/goodvibes-plugin