GitHub 로그인
KO

Claude Code용 JumPHP 패널

Claude가 게임을 만드는 동안 무슨 일을 하는지 지켜보세요. 대화창 옆의 패널이 실행 중인 테스트와 Claude가 보고 있는 게임 화면을 보여 주고, 직접 개입할 수도 있게 해 줘요. Claude Code의 모드인 jumphp-live이며 JumPHP에 포함되어 있어요.

설치하기

Claude Code(터미널)에서 다음을 입력하세요.

/plugin install jumphp-live --marketplace davidnurdin/jumPhp

소스를 추가하겠냐고 물으면 y로 답하고, 범위를 고르세요("user": 모든 프로젝트에 적용). 셸에서는 claude plugin install jumphp-live --marketplace davidnurdin/jumPhp를 실행해요.

사용하기

JumPHP 프로젝트(bin/jumphp가 있는 폴더)에서 Claude Code를 실행하고 /jumphp <게임>을 입력하세요. 예: /jumphp pong. 패널이 오른쪽에 열려요(창이 충분히 넓어야 해요. 110열 이상). Claude가 처음 bin/jumphp test나 bin/jumphp shot을 실행할 때도 저절로 열려요.

패널이 보여 주는 것은 다음과 같아요.

  • 실시간 검증: Claude가 bin/jumphp test를 실행하면 출력이 패널에 흘러가고 단계가 끝날 때마다 체크돼요. ✔ php -l ✔ phpstan … phpunit smoke test. 끝나면 PHPUnit 요약과 실패한 항목(실패한 테스트, PHP 경고와 오류)이 표시돼요.
  • 실시간 게임 화면(● live): bin/jumphp test(스모크 테스트)나 bin/jumphp shot이 게임을 실행하는 동안 패널이 프레임 단위로 화면을 보여 줘요(엔진이 var/live/frame.png를 계속 다시 쓰며, JUMPHP_LIVE 옵션이에요). 창 없이 실행하면 실시간보다 빨라요. JUMPHP_REALTIME=1을 쓰면 게임 속도로 늦춰져요. 이 옵션이 생기기 전에 만든 프로젝트는 git pull jumphp main으로 받아요(원본 JumPHP 저장소는 jumphp라는 이름으로 보관돼요).
  • 눈앞에서 보는 게임 테스트: 게임을 플레이하는 테스트가 실행되는 동안 표시되고(⏳, 이어서 ✔ / ✘), 라이브 화면 위에 현재 테스트 이름이 나와요. 끝난 뒤에는 테스트를 클릭해 마지막 프레임을 볼 수 있어요. 🐢 Game speed / ⏩ Fast 버튼(r)으로 속도를 고르세요. 게임 속도(기본값, 패들이 움직이는 모습을 볼 수 있어요) 또는 최대한 빠르게예요.
  • 화면: bin/jumphp shot이나 siteshot이 방금 찍은 스크린샷, 그리고 Claude가 게임을 보려고 연 모든 이미지가 패널에 표시돼요.
  • 어떤 터미널에서든 보이는 이미지: 기본적으로 작은 색 블록(▦ Blocks)으로 그려져서 트루컬러를 지원하는 터미널(GNOME Terminal, Konsole, Windows Terminal, VS Code…)이면 어디서나 보여요. 이를 위해 엔진이 PNG 옆에 작은 원시 복사본(.rgb)을 함께 써요. kitty, Ghostty, iTerm2에서는 패널이 PNG를 그대로 표시하고(🖼 HD), p 키로 전환해요. 🖼 Open 버튼(o)은 표시된 이미지를 내 데스크톱의 이미지 뷰어(xdg-open, macOS에서는 open)로 원래 크기로 열어요.
  • 플레이그라운드: Claude가 MCP 서버를 사용할 때 사이트의 PHPUnit 테스트 결과(run_tests, get_test_run)와 게시(sync_project) 결과를 보여 줘요.

할 수 있는 일은 다음과 같아요.

  • ▶ Tests(t 키)와 📸 Shot(s): Claude 없이 테스트나 스크린샷을 바로 실행해요. 출력은 패널에 흘러가요.
  • 🛠 Ask Claude to fix(f): 실패한 뒤에 누르면 Claude가 실패한 내용을 받아 고쳐요.
  • Tell Claude: Claude에게 메시지를 쓰는 입력란이에요("더 높이 점프하게 해 줘", "보스가 너무 어려워"). Claude가 현재 단계를 마치는 대로 읽어요.

Claude를 따라가는 방법

Claude가 bin/jumphp test, shot, siteshot, webshot을 실행하는 Bash 명령은 그대로 실행되고, 출력은 패널이 따라가는 임시 파일에도 복사돼요({ export JUMPHP_LIVE=1; 명령 } 2>&1 | tee …, 종료 코드는 그대로 유지돼요). 다른 명령은 건드리지 않아요. 어떤 것도 다른 곳으로 전송되지 않아요.