[VSCode] 디버깅(Debugging) & 관련 단축키

디버깅(Debugging)이란?

디버깅(Debugging)은 코드에서 오류를 찾기 위해 코드의 실행/동작 과정을 분석하고 추적하는 것을 말한다. 

 

 

 

디버깅(Debugging) 단계

VSCode에서 디버깅은 다음과 같은 단계로 진행된다.

 

 

1.  소스 코드에 중단점(Breakpoint) 설정

 

중단점은 코드 동작을 일시 정지시키는 지점을 의미합니다. 중단점은 코드 줄의 왼쪽 마진을 클릭(빨간색으로 표시)하거나, 해당 줄로 이동한 후 F9 키를 눌러 설정할 수 있다.

 

 

2.  디버깅 창으로 이동

 

왼쪽 사이드바에서 벌레 모양의 디버그 아이콘을 클릭하거나, Ctrl+Shift+D 단축키를 사용하여 디버깅 창으로 이동한다.

 

 

3.  디버그 세션 시작 & 스텝(Step) 진행

 

디버그 실행 버튼('Run and Debug')을 클릭하거나, F5 키를 클릭하여 디버그 세션을 시작한다. 세션을 시작하면 설정한 중단점마다 코드 동작이 일시정지된다.

 

세션을 시작한 후에는 디버그 스텝(Step)을 통해 중단점을 단계별로 이동할 수 있습니다.

위에 뜨는 탭을 클릭해 다음 줄로 이동("Step Over"), 함수 내부로 이동("Step Into"), 함수 바깥으로 이동("Step Out")하거나, 각각에 해당하는 단축키를 사용할 수 있다.

 

 

4.  디버그 콘솔 창(Debug Console)으로 변수값 확인 또는 명령 실행

 

디버그 콘솔 창은 디버깅 도중에 프로그램의 상태를 확인하고 조작할 수 있는 창이다. 이 창에서는 다음과 같은 작업을 수행할 수 있다.

 

- 변수 확인 : 변수를 입력하고 엔터를 누르면 해당 변수값을 확인할 수 있다.

- 명령 실행 : 프로그램이 일시 중지된 상태에서 명령을 실행할 수 있다. 예를 들어, 특정 함수를 호출하거나 원하는 동작을 수행할 수 있다.

 

 

5.  디버그 설정(Debug Configuration)

 

언어와 프레임워크에 따라 디버그를 설정하거나 .launch.json 파일에서 커스터마이징할 수 있다.

 

 

 

*주요 단축키*

 

- 중단점 설정 : F9

- 디버그 시작/중지 : F5

- 한 줄씩 실행(Step Over) : F10

- 함수 내부로 진입(Step Into) : F11

- 함수에서 빠져나오기(Step Out) : Shift + F11

- 다음 중단점으로 이동 : F5

- 디버그 콘솔 열기/닫기 : Ctrl + 백틱(`)

 

이외에도 VSCode의 '키 바인딩 설정'에서 디버그 관련 단축키를 사용자 지정할 수 있다.