컨텐츠로 건너뛰기

미리보기 및 개발 서버

개발 서버를 시작하면 OpenChamber는 별도의 브라우저 탭이 아니라 앱 안에서 바로 열 수 있습니다. 그래서 채팅 옆에서 사이트를 보고, 콘솔을 캡처하고, 요소를 가리켜 질문할 수 있습니다.

미리보기 열기

OpenChamber는 터미널 출력에서 로컬 주소(Vite, Next.js, Astro 같은 도구가 출력하는 Local: 줄)를 감시합니다. 발견하면 다음과 같이 동작합니다.

  • 터미널에 Open preview 버튼이 나타납니다
  • auto-open이 켜진 프로젝트 액션이 대신 열어줍니다
  • 채팅 메시지의 로컬 링크로도 열 수 있습니다

사이트는 사이드 패널에 로드됩니다. 로컬 주소(사용자 자신의 컴퓨터)만 미리볼 수 있습니다.

콘솔과 검사

미리보기 패널에서 다음을 할 수 있습니다.

  • 페이지의 console(오류, 경고, 로그)을 원하는 대로 필터링하여 확인
  • inspect를 켜고 임의의 요소를 클릭한 뒤 그에 대한 메모(선택자, 스타일, 위치, 스크린샷)를 바로 채팅으로 전송

이것은 설명 없이 에이전트에게 “여기 이 버튼”이라고 알리는 가장 빠른 방법입니다.

관련 항목

  • Project Actions — 서버를 시작할 때 자동으로 열기
  • Desktop Browser — 데스크톱에서 임의의 페이지에 동일한 도구 사용