Ajax 디버깅

디버깅 안하기, 혹은 디버거 안쓰기

강력한 디버깅 툴을 찾기 전에, 디버깅 자체를 줄이는 방법이나 디버거 없이도 디버깅을 할 수 있도록 하는 방법을 고민하는 것이 좋습니다. 일례로 Javascript TDD를 하는 등 다양한 방법으로 피드백 주기를 짧게 줄이고, 코드를 깔끔하게 유지(Clean Code That Works)하면 디버깅을 거의 안하게 되거나, 디버깅을 하더라도 특별한 툴의 도움 없이도 쉽게 할 수 있습니다.

기본적인 디버깅 도구들

window.alert

가장 직관적이고 가장 널리 쓰이며 사용하기 쉬운 디버깅 도구 입니다. "잘못된 인자입니다. 0번째 줄"과 같은 애매한 에러 메시지가 나오는 경우에 수동 Binary Search를 통해 정확한 에러 위치를 빠르게 찾아낼 수 있습니다.  --;

document.title

window.alert과 달리 대화상자가 뜨지 않으므로 확인 버튼을 누르지 않아도 된다는 장점이 있기 때문에 반복문 안에서 뭔가를 찍어보고 싶다거나 할 때 활용하면 좋습니다. 하지만, window.alert과는 달리 길이 제한이 있다는 단점도 있습니다.

console.log

FireBug를 설치하면 window.console.log 메서드가 추가됩니다. 이 메서드를 통해 FireBug의 콘솔창에 로그를 출력할 수 있습니다.

주소창

주소창에 Javascript 입력해서 디버깅하기: See Browser Address Bar as Debugger

고급 디버깅 도구들

공용:

• http://slayeroffice.com/index.php 의 Favelet Suite - HTTP Response Header Viewer, Hidden Field Modifier, DOM Inspector 등 유용한 디버깅 툴(혹은 해킹툴 ㅎㅎ)을 모아둔 BookMarklet 입니다.

Internet Explorer:

• Microsoft Script Debugger는 기본적인 디버깅 기능을 제공합니다

• Visual Studio의 디버거: breakpoint, stepping, stack tracing, watching 등 모든 기능이 다 지원됩니다.

• IE Dev Toolbar

FireFox:

• FireBug - FireFox 최고의 디버깅 / 프로파일링 / 테스팅 툴

• http://www.squarefree.com/shell/ - Interactive Shell 입니다. Firefox의 경우 BookMarklet으로 등록해두면 원하는 페이지에서 Shell을 띄워 inspection을 할 수 있습니다. (JavascriptShell)

• Venkman Javascript Debugger: FireFox extension인데 Visual Studio의 디버거 만큼이나 강력해서 왠만한 기능을 다 지원하는 디버거 입니다. http://www.mozilla.org/projects/venkman/

Safari:

• Safari Enhancer

Opera:

• http://dev.opera.com/articles/view/opera-developer-tools

개발 환경과 사용 환경을 가깝게

디버깅 도구가 설치되어 있지 않은 사용자 PC에서 오류가 발생할 경우, 오류가 발생한 그 순간에 사용자 PC에서 직접 디버깅을 할 수 있다면 재현 불가능해보이는 버그들을 찾는데 큰 도움이 됩니다:

• Browser Address Bar as Debugger

• 서비스에 간단한 디버깅/개발 도구 내장하기 - Springnote 편집기 빈 줄에서 [[dev]]를 입력하고 엔터를 누르면 Javascript 입력 영역이 나타납니다.

이 글과 관련있는 글을 자동검색한 결과입니다 [?]

• 디버깅은 겸손하게 by 시즈하
• VC++6.0 디버깅 세 번째 시간 - "Set Next Statement" by sally
• 최고의 가격대 성능비를 자랑하는 디버거 by Paromix
• 웹 프로그래밍에서 정말 필요한 것.. by 미친병아리
• 디버깅 유형. by 로리시아

출처 : Jania's