project-architecture

プロジェクトアーキテクチャのガードレール

有効化の条件

Next.js または Astro アプリの UI、レイアウト、コンポーネント構成、状態フロー、テーマ設定、データ表示、サーバー／クライアント境界を変更する前に、このスキルを読み込んでください。

厳守事項

1. 作業を始める前にプロジェクトのフレームワークを特定し、決めつけないでください。
2. サーバー優先のレンダリングを維持してください。インタラクションにクライアント側の処理が不可欠な場合に限り追加し、その範囲をできるだけ小さくしてください。
3. フレームワークの API やプロジェクト構成を変更する前に、インストールされているフレームワークの公式ドキュメントを読んでください。
4. DESIGN.md がある場合は、ビジュアルおよび UX に関する判断にその内容を反映してください。
5. カスタムのマークアップやスタイルを書く前に、既存の shadcn プリミティブとセマンティックトークンを活用してください。shadcn-component-boundaries がインストールされている場合は読み込んでください。
6. すべてのデータ表示で、読み込み中、空、エラーの各状態を明示してください。
7. リスクに応じたテストを追加し、プロジェクトにすでにあるテストツールを使用してください。

判断基準

プロジェクトの兆候	フレームワーク	ガイダンス
package.json の依存関係に next がある、または next.config.* ファイルがある	Next.js	references/next.md
package.json の依存関係に astro がある、または astro.config.* ファイルがある	Astro	references/astro.md
両方ある、またはどちらもない	不明	停止し、変更対象のアプリを確認してください

実行手順

1. package.json を読み、ルートの設定ファイルを一覧表示してフレームワークを特定します。
2. 該当するリファレンスを読み込み、その境界ルールを適用します。
3. 新しく作成する前に、既存のコンポーネント、ルート、スタイルを検索します。
4. 動作に必要な範囲にクライアント側の処理を抑えて変更を実装します。
5. 作業終了前のチェックリストに回答し、project-min-evaluation がインストールされている場合は読み込むか、プロジェクトの品質チェック用スクリプトを実行します。

作業終了前のチェックリスト：

• 不要なクライアント側の処理を追加していませんか？
• DESIGN.md に従っていますか？
• 読み込み中、空、エラーの各状態を明示していますか？

出力要件

検出したフレームワーク、追加または移動したサーバー／クライアント境界とそれぞれの理由、チェックリストへの回答を報告してください。

リファレンス

• references/next.md — Next.js のサーバー／クライアント境界ルール。
• references/astro.md — Astro のアイランド境界ルール。