서버 스튜디오(Server Studio)에 로컬 개발 서버 저장

서버를 대시보드에 저장

사용자는 Server Studio를 실행합니다. 이 앱은 로컬 서버를 목록화하여 한 번의 클릭으로 실행/중지할 수 있게 해줍니다. 이 스킬은 서버를 대시보드에 추가하여 서버가 분실되지 않도록 합니다.

사용 시기

로컬 포트에서 실행되는 모든 것을 빌드하거나 설정한 후에 등록하세요. 예:

• 사이트/앱을 스캐폴딩했고, dev 명령어가 localhost:3000에서 npm run dev인 경우
• 정적 미리보기, Vite/Next/Astro 서버, php -S, wp-env, Storybook 등을 시작한 경우
• 사용자가 "서버를 저장", "대시보드에 추가", "등록"을 요청하는 경우

실행 명령어나 포트가 아직 명확하지 않다면, 먼저 확인하세요(package.json scripts, 프레임워크 기본 포트, 서버 시작 시 출력된 내용 등). 무작정 추측하지 마세요.

핵심 규칙: 프로젝트당 하나의 영구 포트

모든 프로젝트는 절대 변경되지 않는 하나의 고정된 고유 포트를 할당받습니다. 저장된 항목은 포트가 올바르게 유지되어야만 유용하므로:

1. 한 번 할당합니다. 새 프로젝트의 경우, 스크립트가 --assign으로 사용되지 않은 포트를 선택하거나(또는 특정 --url을 전달) 하여 두 프로젝트가 포트를 공유하지 않도록 보장합니다.

2. 프로젝트에 고정하여 개발 서버가 항상 정확한 포트를 사용하도록 합니다. 절대 임의의 포트로 변경되지 않도록 합니다. 프레임워크의 strict-port 옵션을 사용하여 다른 포트로 이동하는 대신 명확하게 실패하도록 합니다.

   병합, 절대 교체하지 마세요. 이미 설정이 있는 경우, 포트와 strict-port 키만 변경하고 다른 모든 키는 그대로 유지합니다. server 블록에는 종종 proxy, host, https 또는 hmr 설정 등 수동으로 조정된 값이 있을 수 있으며, 이를 잃는 것은 포트가 변경되는 것보다 훨씬 나쁩니다. 그러한 편집을 정밀하게 수행할 수 없다면, 블록을 덮어쓰지 말고 사용자에게 알리고 중단하세요.

   • Vite: vite.config에서 server.port를 <n>으로, server.strictPort를 true로 설정하고, server 블록에 이미 있는 다른 모든 키는 유지합니다. server 블록이 전혀 없는 경우에만 해당 두 키만 포함하는 블록을 추가하세요. (또는 설정을 그대로 두고 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 "/absolute/path/to/project" \
  --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.
• 대시보드는 몇 초마다 자동으로 새로고침되므로, 새 항목이나 업데이트된 항목이 자동으로 나타납니다.

어시스턴트의 기본 동작

로컬 서버가 포함된 무언가를 빌드 완료하면 자동으로 저장하고, 사용자에게 한 줄로 저장한 내용을 알려주세요. "'X'를 Server Studio에 저장했습니다. 탭을 새로고침하여 실행하세요."와 같이 간편하게 알려주세요. 진정한 로컬 서버가 없는 경우에만 저장을 건너뛰세요.