CodeGym /행동 /Frontend SELF KO /프로그램 디버깅

프로그램 디버깅

Frontend SELF KO
레벨 38 , 레슨 2
사용 가능

9.1 버그의 등장

소프트웨어 디버깅은 프로그램에서 오류 또는 버그를 찾고 수정하는 과정이야. 이건 소프트웨어 개발에서 가장 흥미로운 부분이고 프로그램이 제대로 작동하도록 보장하는 데 도움을 준다구.

"bug" 용어의 역사

"bug"(버그)는 컴퓨터 프로그램의 오류를 지칭하는 용어로, 1940년대에 처음 사용되었어. 사실 이런 "버그"라는 개념은 컴퓨터가 등장하기 전에도 있었는데, 다양한 기계 장치에서 발생하는 기계적 결함을 의미했었지.

컴퓨터 기술에서 "bug" 용어가 문서화된 첫 번째 사례는 1947년에 하버드 대학교에서 Mark II 컴퓨터를 작업하던 팀이었어. 팀은 한 릴레이가 동작하지 않는 이유가 그 안에 들어간 나방 때문이라는 걸 발견했어. 그들은 곤충을 제거하고 이를 "실제 곤충 발견의 첫 번째 사례"(literal bug)로 일지에 기록했어.

이게 "bug"라는 용어가 오류를 지칭하기 위한 최초의 사용 사례는 아니었지만, 이 사건이 널리 알려지면서 "bug"라는 용어가 대중화되었어.

bug

프로그램 디버깅

디버깅은 소프트웨어에서 버그를 찾고 진단하고 수정하는 과정이야. 디버깅 과정은 몇 가지 단계로 이루어져:

  1. 오류 발견: 프로그램에 오류가 있다는 징후를 식별하는 것.
  2. 오류 재현: 오류가 다시 발생하도록 조건을 만들어서 오류의 본질을 더 잘 이해하는 것.
  3. 문제 진단: 코드를 분석하고 오류의 원인을 찾기 위한 다양한 도구와 방법을 사용하는 것.
  4. 오류 수정: 오류를 제거하기 위해 코드에 변경을 가하는 것.
  5. 테스트: 수정 사항을 확인하고 프로그램을 테스트하여 오류가 해결되었고 새로운 문제가 생기지 않았는지 확인하는 것.

그래서 버그 (bug)는 프로그램에서 발생하는 모든 오류를 일컫는 일반적인 용어이고, 디버깅(de-bug)은 이러한 오류를 찾고 수정하는 과정이야.

9.2 디버깅 도구와 방법

로깅(logging)

프로그램 코드에 로그를 추가하면 실행 흐름을 추적하고 프로그램 실행 중 변수 상태와 연산에 대한 정보를 얻을 수 있어. JavaScript에서는 winston이라는 훌륭한 라이브러리가 있어.

로깅 사용 예제:

JavaScript
    
      const { createLogger, format, transports } = require('winston');

      // 디버그 레벨의 로거 생성
      const logger = createLogger({  level: 'debug' });

      // 나누기 함수
      function divide(a, b) {
        logger.debug(`${a}를 ${b}로 나눕니다.`);
        if (b === 0) {
          logger.error("0으로 나누려고 했습니다!");
          return null;
        }
        return a / b;
      }

      // 함수 사용 예제
      const result = divide(10, 2);
      console.log(result); // 출력: 5
    
  

디버거(Debugger) 사용

디버거는 개발자가 프로그램을 step-by-step으로 실행하고, breakpoints를 설정하고, 변수 값을 확인하거나 실행 중 변수를 변경할 수 있는 도구야.

JavaScript에서 인기 있는 디버거:

  • Chrome DevTools: Google Chrome 브라우저에 내장된 디버거
  • Firefox Developer Tools: Mozilla Firefox 브라우저에 내장된 디버거
  • Node.js Debugger: Node.js에서 서버 측 JavaScript를 위한 내장 디버거
  • Visual Studio Code Debugger: Visual Studio Code 에디터에 내장된 디버거

Node.js에서 디버거 사용 예제:

JavaScript
    
      // 내장 디버깅 모듈 가져오기
      const { inspect } = require('util');

      // 오류가 있는 함수 예제
      function faultyFunction(a, b) {
        debugger; // breakpoint 설정
        let result = a / b;
        return result;
      }

      // 오류가 있는 함수 호출
      console.log(faultyFunction(10, 0));
    
  

프로그램이 debugger에 도달하면 중단되고, 다음 명령(step over), 내부로 이동(step into), 외부로 나가기(step out), 변수 값 확인 등 다양한 디버깅 명령을 사용할 수 있어.

우리는 Intellij IDEA에 내장된 디버거를 사용해서 디버깅을 배울 거야 (Ultimate Edition 버전 필요).

9.3 debug 사용법

일반적으로 debug는 디버깅 도구와 관행을 적극 활용하여 오류를 찾고 수정하는 것을 포함해.

디버깅 단계:

  1. breakpoint 설정: 관심 있는 코드 부분에서 프로그램 실행을 중단하기 위해 breakpoints를 설정해.
  2. step-by-step 실행: 프로그램을 단계별로 실행하면서 프로그램 상태와 변수 값을 관찰해.
  3. 변수 분석: 프로그램 실행의 다양한 단계에서 변수와 표현식의 값을 조사하여 잘못된 데이터나 논리적 오류를 식별해.
  4. 오류 수정: 발견된 오류를 해결하기 위해 코드에 변경 사항을 적용해.
  5. 재테스트: 오류를 수정한 후 프로그램을 다시 테스트하여 오류가 해결되었는지, 새로운 문제가 없는지 확인해.

간단해 보이지 않아? 다음 강의에서 이러한 단계를 자세히 살펴보자 :)

코멘트
TO VIEW ALL COMMENTS OR TO MAKE A COMMENT,
GO TO FULL VERSION