mehdi214designer/server-studio

サーバーをダッシュボードに保存

ユーザーは Server Studio を実行しています。これはローカルサーバーを一覧表示し、ワンクリックで起動/停止できるアプリです。 このスキルはサーバーをそのダッシュボードに追加し、サーバーが見えなくなったり忘れられたりするのを防ぎます。

使用するタイミング

ローカルポートで動作するものをビルドまたはセットアップした後に、それを登録します。例:

• サイト/アプリをスキャフォールドし、dev コマンドが npm run dev で localhost:3000 で動作する場合
• 静的プレビュー、Vite/Next/Astro サーバー、php -S、wp-env、Storybook などを開始した場合
• ユーザーが「サーバーを保存」「ダッシュボードに追加」「これを登録」と依頼した場合

実行コマンドやポートがまだ明確でない場合は、まずそれを調べてください（package.json のスクリプト、フレームワークのデフォルトポート、またはサーバー起動時の出力を確認）。推測で適当な値を設定しないでください。

黄金律：プロジェクトごとに1つの固定ポート

すべてのプロジェクトには1つの固定されたユニークなポートを割り当て、それが変更されることは決してありません。保存されたエントリが役立つのは、そのポートが正しいままの場合だけです。そのため:

1. 一度割り当てる。 新しいプロジェクトの場合、スクリプトに --assign を指定して、未使用のポートを選ばせます（または特定の --url を渡します）。これにより、2つのプロジェクトが同じポートを共有することがなくなります。

2. そのポートをプロジェクトに焼き付け、dev サーバーが常にその正確なポートを使用するようにする。 ランダムなポートにドリフトせず、厳密なポートオプションを使用して、代わりに別のポートに移動するのではなく、エラーを明示的に失敗させるようにします。

   マージ、置換はしない。 設定を書き込む場所に既存の設定がある場合は、ポートと strict-port のキーのみを変更し、他のすべてのキーはそのままにします。server ブロックには、手動で調整された proxy、host、https、hmr などの設定が含まれていることが多く、それらを失うことは、ポートがドリフトするよりもはるかに悪影響です。外科的な編集ができない場合は、ブロックを書き換えるのではなく、処理を停止してユーザーに伝えてください。

   • Vite: vite.config で server.port を <n> に、server.strictPort を true に設定し、server 内の他のキーはすべて保持します。server ブロックがまったく存在しない場合にのみ、これら2つのキーのみを持つブロックを追加します（または、設定を触らずに dev スクリプトで vite --port <n> --strictPort を使用します）。
   • Next.js: dev スクリプト → next dev -p <n>
   • Astro: astro dev --port <n>
   • CRA / react-scripts: PORT=<n> react-scripts start
   • プレーンな Node/Express: process.env.PORT || <n> を読み取り、ポートを文書化します
   • PHP: php -S localhost:<n> 登録する --command と --url にまったく同じポートを指定します。

3. 再割り当てしない。 同じプロジェクトに対してこのスキルを再実行すると、ロックされたポートは維持され、他のフィールドのみが更新されます。スクリプトがこれを強制します。ユーザーが明示的にプロジェクトを新しいポートに移動したい場合を除き、--force を渡さないでください。

保存方法

ヘルパースクリプトを、既知のフィールドを指定して実行します。必須なのは --name（または --url/--command）のみです。

新しいプロジェクトの場合は、--assign を追加して保証されたユニークなポートを取得し、スクリプトが出力する PORT <n> 行を読み取り、そのポートをプロジェクト設定に焼き付けます（上記の黄金律を参照）。

node "$HOME/.claude/skills/server-studio/register-server.js" \
  --name "プロジェクト名" \
  --project "何のためのものか" \
  --folder "WordPress" \
  --cwd "/絶対パス/プロジェクト" \
  --command "npm run dev -- --port 3001 --strictPort" \
  --url "localhost:3001" \
  --tag "Vite" \
  --note "覚えておくべきこと（ログインなど）" \
  --assign

フィールドガイド:

• --name — 短いラベル（例: 「ポートフォリオサイト」）
• --project — それが属するプロジェクト/タスク
• --folder — ファイルを整理するフォルダー名（存在しない場合は作成され、サイドバーに表示されます）。 --category は古い呼び出し元のエイリアスとして引き続き機能します。
• --cwd — 絶対パスのプロジェクトフォルダー。実行コマンドはここで実行されます。
• --command — サーバーを起動する正確なコマンド（実行ボタンがこれを実行します）
• --url — アドレスまたはポート番号のみ（3000 は localhost:3000 として解釈されます）
• --tag — 小さな詳細: Vite、MAMP、Next、php など
• --note — オプションのリマインダー（資格情報、注意点）

動作

• スクリプトは既存のプロジェクトをフォルダー（cwd）または名前で照合します。見つかった場合はそのエントリを更新しますが、ロックされたポートは保持します。見つからなかった場合は新しいエントリを追加します。繰り返し実行しても安全で、重複は作成されず、プロジェクトのポートが移動することもありません。
• ポートはすべてのエントリ間でユニークです。--assign は 3001 から始まる最も低い空きポートを選択します。
• スクリプトは PORT <n> を出力します — プロジェクトの dev 設定を配線するときにその番号を使用してください。
• データは Server Studio のデータファイルに書き込まれます: macOS では ~/Library/Application Support/Server Studio/data.json、Windows では %APPDATA%\Server Studio\data.json、Linux では ~/.config/server-studio/data.json。
• ダッシュボードは数秒ごとに自動更新されるため、新しい/更新されたエントリは自動的に表示されます。

アシスタントのデフォルト動作

ローカルサーバーを伴う何かを構築し終えたら、自動的にそれを保存し、ユーザーに1行で保存した内容を伝えてください。カジュアルに、「'X' を Server Studio に保存しました。タブをリロードして実行してください」のように伝えてください。ローカルサーバーがまったく関係ない場合にのみ、保存をスキップしてください。