mehdi214designer/server-studio

Server zum Dashboard hinzufügen

Der Benutzer verwendet Server Studio, eine App, die lokale Server auflistet und mit einem Klick starten/stoppen lässt. Dieser Skill fügt einen Server zu diesem Dashboard hinzu, damit nichts verloren geht.

Wann verwenden

Nachdem Du etwas gebaut oder eingerichtet hast, das auf einem lokalen Port läuft, registriere es. Beispiele:

• Du hast eine Website/App aufgesetzt und der Dev-Befehl lautet npm run dev auf localhost:3000
• Du hast eine statische Vorschau gestartet, einen Vite/Next/Astro-Server, php -S, wp-env, Storybook usw.
• Der Benutzer bittet darum, „den Server zu speichern“, „zum Dashboard hinzuzufügen“ oder „zu registrieren“

Falls der Startbefehl oder Port noch nicht offensichtlich ist, finde es zuerst heraus (überprüfe package.json Scripts, den Standardport des Frameworks oder was der Server beim Start ausgegeben hat). Rate nicht wild.

Die goldene Regel: ein fester Port pro Projekt

Jedes Projekt bekommt EINEN festen, eindeutigen Port, der sich NIE ändert. Ein gespeicherter Eintrag ist nur nützlich, wenn sein Port korrekt bleibt, daher:

1. Einmal zuweisen. Für ein neues Projekt lasse das Skript mit --assign einen freien, nie verwendeten Port auswählen (oder übergib einen bestimmten --url). So ist sichergestellt, dass keine zwei Projekte denselben Port teilen.

2. Den Port ins Projekt einbauen, sodass der Dev-Server IMMER diesen genauen Port verwendet, niemals einen zufälligen. Verwende die Strict-Port-Option des Frameworks, damit es laut fehlschlägt, anstatt auf einen anderen Port auszuweichen.

   Ersetzen durch Zusammenführen, nie ersetzen. Wenn bereits eine Konfiguration vorhanden ist, in die Du schreibst, ändere nur den Port und den Strict-Port-Schlüssel und lasse jeden anderen Schlüssel exakt so, wie er ist. Ein server-Block enthält oft proxy, host, https oder hmr-Einstellungen, die jemand von Hand angepasst hat, und diese zu verlieren ist weitaus schlimmer als ein driftender Port. Wenn Du diese Bearbeitung nicht chirurgisch durchführen kannst, stoppe und sage es dem Benutzer, anstatt den Block neu zu schreiben.

   • Vite: in vite.config setze server.port auf <n> und server.strictPort auf true, behalte dabei jeden anderen Schlüssel, der bereits in server steht. Nur wenn es überhaupt keinen server-Block gibt, füge einen hinzu, der nur diese beiden enthält. (Oder lasse die Konfiguration unberührt und verwende vite --port <n> --strictPort im Dev-Script.)
   • Next.js: Dev-Script → next dev -p <n>
   • Astro: astro dev --port <n>
   • CRA / react-scripts: PORT=<n> react-scripts start
   • Plain Node/Express: lese process.env.PORT || <n> und dokumentiere den Port
   • PHP: php -S localhost:<n> Setze denselben Port in den --command und --url, die Du registrierst.

3. Nie neu zuweisen. Wird der Skill für dasselbe Projekt erneut ausgeführt, behält es seinen festgelegten Port – es werden nur die anderen Felder aktualisiert. Das Skript erzwingt dies; übergib --force nur, wenn der Benutzer explizit ein Projekt auf einen neuen Port verschieben möchte.

Wie speichern

Führe das Hilfsskript mit den Feldern aus, die Du kennst. Nur --name (oder --url/--command) ist erforderlich.

Für ein NEUES Projekt füge --assign hinzu, um einen garantiert eindeutigen Port zu erhalten, lies dann die Zeile PORT <n>, die es ausgibt, und baue diesen Port in die Projektkonfiguration ein (siehe die goldene Regel oben).

node "$HOME/.claude/skills/server-studio/register-server.js" \
  --name "Projektname" \
  --project "Wofür es ist" \
  --folder "WordPress" \
  --cwd "/absoluter/pfad/zum/projekt" \
  --command "npm run dev -- --port 3001 --strictPort" \
  --url "localhost:3001" \
  --tag "Vite" \
  --note "alles, woran man sich erinnern sollte, z.B. Login" \
  --assign

Feldbeschreibung:

• --name — kurze Bezeichnung, z.B. „Portfolio-Seite“
• --project — das Projekt/die Aufgabe, zu der es gehört
• --folder — Ordnername, unter dem es abgelegt wird; wird erstellt, falls er noch nicht existiert (wird in der Seitenleiste angezeigt). --category funktioniert weiterhin als Alias für ältere Aufrufer.
• --cwd — absoluter Projektordner; der Ausfühbefehl wird hier ausgeführt
• --command — der genaue Befehl, der den Server startet (dieser Befehl wird vom Run-Button ausgeführt)
• --url — Adresse oder bloßer Port (3000 funktioniert, wird zu localhost:3000)
• --tag — kleines Detail: Vite, MAMP, Next, php
• --note — optionale Erinnerungen (Zugangsdaten, Fallstricke)

Verhalten

• Das Skript sucht ein vorhandenes Projekt anhand des Ordners (cwd) oder Namens. Wird es gefunden, aktualisiert es diesen Eintrag, behält aber seinen festgelegten Port; andernfalls fügt es einen neuen hinzu. Kann bedenkenlos mehrfach ausgeführt werden, es werden keine Duplikate erstellt und der Port eines Projekts wird nicht verschoben.
• Ports sind über alle Einträge hinweg eindeutig. --assign wählt den niedrigsten freien Port ab 3001.
• Das Skript gibt PORT <n> aus – verwende diese Zahl, wenn Du die Dev-Konfiguration des Projekts verdrahtest.
• Die Daten werden in die Server-Studio-Datendatei geschrieben: ~/Library/Application Support/Server Studio/data.json auf macOS, %APPDATA%\Server Studio\data.json unter Windows, ~/.config/server-studio/data.json unter Linux.
• Das Dashboard aktualisiert sich automatisch alle paar Sekunden, sodass neue/aktualisierte Einträge von selbst erscheinen.

Standardverhalten des Assistenten

Wenn Du etwas fertig gebaut hast, das einen lokalen Server hat, speichere es automatisch und teile dem Benutzer in einer Zeile mit, was Du gespeichert hast. Halte es locker, z.B. „'X' wurde in Deinem Server Studio gespeichert, lade den Tab neu, um es auszuführen.“ Überspringe das Speichern nur, wenn es wirklich keinen lokalen Server gibt.