RecordIt버그 리포트를 위한 미션 컨트롤콘솔 로그와 네트워크 로그가 함께 기록되는 화면 녹화
버그 리포트와 디버깅을 위한 설계: 모든 녹화에 화면에서 벌어지는 일 뒤의 콘솔, 네트워크, 상호작용 데이터가 프레임 단위로 동기화되어 담깁니다.
디버그 데이터가 영상 재생과 동기화되는 방식 보기
버그 리포트에 필요한 모든 것
녹화하는 동안 RecordIt이 개발자가 요구하는 기술적 맥락을 자동으로 기록합니다.
모든 로그, 경고, 오류를 스택 트레이스와 함께 발생하는 순간 기록하고 영상 타임라인에 맞춰 정렬합니다.
fetch와 XHR 호출을 상태 코드, 타이밍, 요청·응답 본문, 그리고 WebSocket 메시지까지 기록하여 실패한 호출을 발생한 바로 그 순간에 확인할 수 있습니다.
클릭, 폼 제출, 페이지 이동이 추적되어 무언가 깨지기 전에 사용자가 정확히 무엇을 했는지 볼 수 있습니다.
'재현 불가'에서 근본 원인까지
재현 단계를 묻는 대신 링크를 보내세요.
스크린샷 대신 링크 공유
링크를 연 사람은 타임라인을 움직이며 실패한 요청이나 콘솔 오류를 발생한 바로 그 프레임에서 확인합니다.
오류로 바로 이동
오류는 타임라인에 표시됩니다. 하나를 클릭하면 영상, 콘솔, 네트워크 화면이 함께 그 지점으로 이동합니다.
LLM에 붙여넣기
클릭 한 번으로 세션 텔레메트리의 구조화된 요약이 복사되어, AI 어시스턴트에 붙여넣고 근본 원인 가설을 받을 수 있습니다.
동작 방식
버그 녹화
확장 프로그램 아이콘을 클릭하고 문제가 발생하는 탭을 녹화하세요. 디버그 기록은 녹화와 함께 자동으로 시작됩니다.
링크 공유
녹화를 업로드하면 팀에 보낼 링크가 생성되고, 영상과 텔레메트리가 한곳에 모입니다.
전체 맥락으로 디버깅
링크가 있는 누구나 영상을 보면서 각 프레임에 동기화된 콘솔, 네트워크, 상호작용 데이터를 살펴볼 수 있습니다.
개발자 FAQ
디버그 기록이 작동하는 방식입니다.
RecordIt은 어떤 디버그 데이터를 기록하나요?
스택 트레이스가 포함된 콘솔 로그, 타이밍과 본문이 포함된 네트워크 요청, WebSocket 메시지, JavaScript 오류, 클릭과 페이지 이동 같은 사용자 상호작용을 기록합니다. 모두 타임스탬프가 찍혀 영상과 동기화됩니다.
요청과 응답 본문도 기록되나요?
네. fetch와 XHR 본문이 상태 코드, 타이밍과 함께 기록되어 버그가 발생했을 때 API가 실제로 무엇을 반환했는지 볼 수 있습니다.
비밀번호와 토큰은 어떻게 되나요?
비밀번호, 인증 헤더, 토큰 형태의 문자열 같은 민감한 값은 데이터가 페이지를 떠나기 전 기록 시점에 마스킹됩니다.
사용자 세션 녹화에 쓸 수 있나요?
네, 선별적인 방식으로 가능합니다. 모든 방문자를 수동적으로 기록하는 대신, 본인이나 사용자가 특정 세션을 텔레메트리가 첨부된 영상으로 녹화합니다. 신고된 버그를 재현하는 데 이상적입니다.
Edge와 Brave에서도 작동하나요?
네. RecordIt은 Chromium 확장 프로그램으로 Google Chrome, Microsoft Edge, Brave에서 작동하며 같은 Chrome 웹 스토어 페이지에서 설치합니다.
세션을 AI 어시스턴트에 넘길 수 있나요?
네. 뷰어에 LLM용 복사 버튼이 있어 콘솔, 네트워크, 오류 텔레메트리의 구조화된 요약을 만들어 어떤 AI 어시스턴트에든 붙여넣을 수 있습니다.