Communityコーディング&開発github.com

PM-lurenyi/component-flow

フロントエンドの共通コンポーネント候補の特定、手動確認、構築、レビュー、ページ移行、および継続的な再利用を実現する Codex スキル

component-flow とは?

このスキルは、フロントエンドプロジェクトにおいて共通コンポーネントのライフサイクル全体を管理するための Codex 向けのワークフローを提供します。具体的には、既存のコードベースから重複やパターンを分析して共通化候補を特定し、開発者が手動で確認・承認できるように支援します。承認されたコンポーネントは、標準化された方法で構築・レビューされ、既存ページへの段階的な移行を促進します。さらに、新しい開発時に既存の共通コンポーネントを優先的に再利用する仕組みを組み込むことで、コードの一貫性を高め、開発効率を向上させます。このスキルは主に Codex プラットフォーム上で動作し、プロジェクト固有のルールや命名規則に従ってカスタマイズ可能です。

対応~Claude Code✓Codex CLI~Cursor
npx skills add PM-lurenyi/component-flow

Installed? Explore more コーディング&開発 skills: steipete/bluebubbles, steipete/eightctl, steipete/blucli · View all 6 →

お気に入りのAIに質問する

このエージェントスキルを事前に読み込んだ状態で新しいチャットを開きます。

ドキュメント

component-flow は何をしますか?

フロントエンド共通コンポーネント候補の特定、手動確認、構築、レビュー、ページ移行、および継続的な再利用を実現する Codex スキル

概要

このスキルは、フロントエンドプロジェクトにおける共通コンポーネントのライフサイクル全体を管理するためのワークフローを提供します。コードベースの分析から始まり、共通化候補の特定、手動確認、構築、レビュー、既存ページへの移行、そして継続的な再利用までをカバーします。

ワークフロー

  1. 候補特定: コードベースを分析し、重複するパターンや類似コンポーネントから共通化候補を特定します。
  2. 手動確認: 開発者が候補をレビューし、共通コンポーネントとして採用するかどうかを判断します。
  3. 構築: 承認された候補に対して、プロジェクトの標準に従って共通コンポーネントを構築します。
  4. レビュー: 構築されたコンポーネントをコードレビューし、品質を保証します。
  5. ページ移行: 既存のページを新しい共通コンポーネントを使用するよう段階的に移行します。
  6. 継続的再利用: 新しい開発時に既存の共通コンポーネントを優先的に使用する仕組みを維持します。

対応プラットフォーム

  • Codex

設定

プロジェクト固有のルールや命名規則に従って、このスキルをカスタマイズできます。詳細については、プロジェクトのドキュメントを参照してください。

関連スキル