feature-slicing

Feature-Sliced Design

FSD v2.1 を適用し、依頼されたモジュール境界の判断を行います。ユーザーの明示的な指示は、このスキルのガイドラインより優先されます。通常のフロントエンド編集は、アーキテクチャを移行する許可にはなりません。

プロジェクト内で作業する

影響を受けるファイル、インポート、フレームワーク／ルーター、依頼された動作を判断材料にします。リポジトリですでに FSD が使われているのか、ユーザーが FSD の採用を求めているのかを確認してください。どちらにも当てはまらない場合は、既存の構成を維持します。

共有で使われるようになるか、明確な責務が生じて抽出する必要が出るまでは、ページ内での所有を優先します。

レイヤー	責務
app	初期化、プロバイダー、ルーティング
pages	画面と、ページ固有の UI、データ、ロジック
widgets	自己完結型の UI ブロック
features	再利用可能なユーザー操作
entities	共有されるビジネス概念
shared	インフラストラクチャと、ドメインに依存しないユーティリティ／UI

必要なレイヤーのみを使用します。特に Next.js では、フレームワークで予約されているディレクトリとサーバー／クライアントの境界を維持してください。

インポートの契約を維持する

• スライスが他のスライスをインポートする場合は、下位レイヤーからインポートし、同じレイヤーや上位レイヤーからはインポートしません。明示的な @x API は、ドキュメント化されたエンティティ間の例外です。
• app と shared にはスライスではなくセグメントがあります。それぞれのセグメントは相互にインポートできます。
• 意図を明確にしたパブリック API を公開します。スライス自身のバレルをインポートしないよう、内部では相対インポートを使用します。サーバー専用のエクスポートは、クライアントのエントリーポイントに含めないでください。
• FSD のセグメントには、目的に沿った名前（ui、api、model、lib、config）を付けます。例に合わせるだけのために、無関係なフォルダー名を変更しないでください。

依頼された配置、リファクタリング、またはレビューを、変更後のインポートパスとともに提示します。コードを変更した場合は、影響を受けるインポートを確認し、利用可能であれば既存のアーキテクチャチェックを実行します。タスクでツールのセットアップが求められない限り、Steiger のインストールやパスエイリアスの書き換えは行いません。

参考資料

現在の判断に必要な参考資料を選択してください。

タスク	参考資料
レイヤーの責務と抽出	LAYERS.md
パブリック API、バレル、循環参照、@x	PUBLIC-API.md
エンティティ／フィーチャー／ウィジェット／ページの具体例	IMPLEMENTATION.md
Next.js のルートディレクトリとサーバー／クライアントのエクスポート	NEXTJS.md
既存コードの移行依頼	MIGRATION.md
インポートマトリクスまたは簡潔な構成の確認	CHEATSHEET.md

仕様に関する質問には、FSD の公式ドキュメントを使用してください。サンプルのライブラリやエイリアスは、インストール済みのスタックに合わせて調整してください。