# 첫 번째 종속성 취약성 찾기 및 수정하기

데모 리포지토리에서 해당 기능을 사용하도록 설정하여 Dependabot 종속성을 안전하게 유지하는 방법을 알아봅니다.

프로젝트에서 **라이브러리** 또는 **패키지**라고 하는 미리 작성된 코드 모음을 사용하는 것이 일반적인 관행입니다. 이러한 코드 모듈은 재사용 가능한 대규모 구성 요소를 처음부터 작성하지 않아도 되므로 많은 시간을 절약해 주며, 새롭고 창의적인 작업에 집중할 수 있도록 도와줍니다. 프로젝트에 추가될 때, 사용자의 작업이 해당 코드에 종속되기 때문에 이를 **종속성**이라고 합니다.

종속성을 사용하는 것은 아주 일반적인 일이지만, 종속성에는 취약한 코드가 포함될 수 있으며, 이로 인해 프로젝트가 안전하지 않게 될 수 있습니다. 다행히 같은 Dependabot 도구는 종속성 취약성을 찾고, 끌어오기 요청을 발생하여 수정하고, 나중에 발생하지 않도록 방지할 수 있습니다. 이 자습서에서는 Dependabot의 기능을 활성화하고 사용하는 방법을 통해 종속성을 안전하게 유지하는 방법을 배웁니다.

## 데모 리포지토리 설정

몇 가지 종속성 취약성이 있는 데모 프로젝트를 포크하여 시작해 보겠습니다. 프로젝트가 배포되지 않으므로, 이 연습에서는 **보안 위험이 없습니다**.

1. [
   `new2code/dependabot-demo`
   ](https://github.com/new2code/dependabot-demo) 리포지토리로 이동합니다.
2. 페이지의 오른쪽 위에서 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-repo-forked" aria-label="repo forked icon" role="img"><path d="M5 5.372v.878c0 .414.336.75.75.75h4.5a.75.75 0 0 0 .75-.75v-.878a2.25 2.25 0 1 1 1.5 0v.878a2.25 2.25 0 0 1-2.25 2.25h-1.5v2.128a2.251 2.251 0 1 1-1.5 0V8.5h-1.5A2.25 2.25 0 0 1 3.5 6.25v-.878a2.25 2.25 0 1 1 1.5 0ZM5 3.25a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Zm6.75.75a.75.75 0 1 0 0-1.5.75.75 0 0 0 0 1.5Zm-3 8.75a.75.75 0 1 0-1.5 0 .75.75 0 0 0 1.5 0Z"></path></svg>를 클릭합니다\*\*\*\*.
3. 표시되는 페이지에서 **Create fork**를 클릭하세요.

## 종속성 보안 기능 활성화하기

이제 프로젝트를 설정했으므로 안전하지 않은 종속성에 대한 수정 사항을 찾아서 만들도록 구성 Dependabot 해 보겠습니다.

1. 리포지토리의 탐색 모음에서 을 클릭합니다 **<svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-shield" aria-label="shield" role="img"><path d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path></svg> Security and quality**.
2. "Dependabot alerts" 행에서 **\[활성화 Dependabot alerts**]를 클릭합니다.
3. "Dependabot" 섹션에서 "Dependabot alerts" 옆에 \[**사용**]을 클릭합니다.
4. 나타나는 팝업에서 종속성 그래프 활성화에 대한 설명을 읽은 다음, **Enable**을 클릭합니다.
5. 종속성 취약성을 수정하는 끌어오기 요청을 자동으로 열 수 있도록 Dependabot 하려면 "Dependabot security updates" 옆에 있는 **\[사용**]을 클릭합니다.

## 안전하지 않은 종속성 보기

구성된 상태에서 Dependabot 취약성이 포함된 종속성 중 어느 것이 있는지 알아보겠습니다.

1. 리포지토리의 탐색 모음에서 을 클릭합니다 **<svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-shield" aria-label="shield" role="img"><path d="M7.467.133a1.748 1.748 0 0 1 1.066 0l5.25 1.68A1.75 1.75 0 0 1 15 3.48V7c0 1.566-.32 3.182-1.303 4.682-.983 1.498-2.585 2.813-5.032 3.855a1.697 1.697 0 0 1-1.33 0c-2.447-1.042-4.049-2.357-5.032-3.855C1.32 10.182 1 8.566 1 7V3.48a1.75 1.75 0 0 1 1.217-1.667Zm.61 1.429a.25.25 0 0 0-.153 0l-5.25 1.68a.25.25 0 0 0-.174.238V7c0 1.358.275 2.666 1.057 3.86.784 1.194 2.121 2.34 4.366 3.297a.196.196 0 0 0 .154 0c2.245-.956 3.582-2.104 4.366-3.298C13.225 9.666 13.5 8.36 13.5 7V3.48a.251.251 0 0 0-.174-.237l-5.25-1.68ZM8.75 4.75v3a.75.75 0 0 1-1.5 0v-3a.75.75 0 0 1 1.5 0ZM9 10.5a1 1 0 1 1-2 0 1 1 0 0 1 2 0Z"></path></svg> Security and quality**.
2. 리포지토리의 Dependabot alerts에 대한 내용을 보려면, 측면 탐색에서 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-dependabot" aria-label="dependabot icon" role="img"><path d="M5.75 7.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-1.5 0v-1.5a.75.75 0 0 1 .75-.75Zm5.25.75a.75.75 0 0 0-1.5 0v1.5a.75.75 0 0 0 1.5 0v-1.5Z"></path><path d="M6.25 0h2A.75.75 0 0 1 9 .75V3.5h3.25a2.25 2.25 0 0 1 2.25 2.25V8h.75a.75.75 0 0 1 0 1.5h-.75v2.75a2.25 2.25 0 0 1-2.25 2.25h-8.5a2.25 2.25 0 0 1-2.25-2.25V9.5H.75a.75.75 0 0 1 0-1.5h.75V5.75A2.25 2.25 0 0 1 3.75 3.5H7.5v-2H6.25a.75.75 0 0 1 0-1.5ZM3 5.75v6.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-6.5a.75.75 0 0 0-.75-.75h-8.5a.75.75 0 0 0-.75.75Z"></path></svg>**Dependabot** 을 클릭합니다.
3. 경고에 대한 자세한 정보를 보려면 경고 제목을 클릭합니다. 이 연습에서는 **Command Injection in hot-formula-parser**를 클릭하세요.

## Dependabot 경고 이해하기

Dependabot 이제 종속성에서 일부 취약성을 확인했으므로 "hot-formula-parser에서 명령 주입" 경고에 제공된 정보를 분석해 보겠습니다.

### 수정 요약

경고 제목 아래에는 이 취약성을 **수정**하는 방법에 대한 간략한 요약이 표시되어 있습니다. 이 요약에는 해결될 경고의 수와 취약성이 발견된 위치도 포함되어 있습니다. 이 경우 경고는 패키지를 버전 3.0.1로 업그레이드 `hot-formula-parser` 하면 파일에서 Dependabot 식별된 하나의 `javascript/package-lock.json` 경고를 수정할 수 있음을 알려줍니다.

이 섹션에서는 Dependabot의 취약점 수정 끌어오기 요청 생성 진행 상황도 추적합니다. 수정 사항을 사용할 수 있게 되면 끌어오기 요청에 연결되는 "<svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-dependabot" aria-label="dependabot icon" role="img"><path d="M5.75 7.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-1.5 0v-1.5a.75.75 0 0 1 .75-.75Zm5.25.75a.75.75 0 0 0-1.5 0v1.5a.75.75 0 0 0 1.5 0v-1.5Z"></path><path d="M6.25 0h2A.75.75 0 0 1 9 .75V3.5h3.25a2.25 2.25 0 0 1 2.25 2.25V8h.75a.75.75 0 0 1 0 1.5h-.75v2.75a2.25 2.25 0 0 1-2.25 2.25h-8.5a2.25 2.25 0 0 1-2.25-2.25V9.5H.75a.75.75 0 0 1 0-1.5h.75V5.75A2.25 2.25 0 0 1 3.75 3.5H7.5v-2H6.25a.75.75 0 0 1 0-1.5ZM3 5.75v6.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-6.5a.75.75 0 0 0-.75-.75h-8.5a.75.75 0 0 0-.75.75Z"></path></svg> 보안 업데이트 검토" 단추가 표시됩니다.

![Dependabot 경고의 수정 요약 섹션 스크린샷](/assets/images/help/dependabot/dependabot-alert-fix-summary.png)

### 취약성 세부 정보

수정 세부 정보 Dependabot 아래에서 다음을 포함하여 취약성에 대한 자세한 정보를 제공합니다.

* 취약한 패키지의 이름
* 취약성이 포함된 패키지의 버전
* 취약성을 해결하는 패키지의 버전
* 취약성 유형 및 악용 방법에 대한 세부 정보

![Dependabot 경고의 취약성 세부 정보 섹션 스크린샷](/assets/images/help/dependabot/dependabot-alert-vulnerability-details.png)

이 경고에서 `parse` 패키지의 `hot-formula-parser` 함수가 사용자 입력의 안전성을 제대로 확인하지 않고 실행하기 때문에, 공격자가 악성 명령을 실행할 수 있게 됩니다.

> \[!TIP] 취약성 세부 정보를 완전히 이해하지 못하는 경우, 설명해 달라고 [요청 Copilot Chat](https://github.com/copilot)해 보십시오.

### 타임라인

마지막으로 페이지 아래쪽에서 경고의 타임라인을 볼 수 있습니다. 현재 타임라인에는 경고를 열 때 Dependabot 타임스탬프가 포함되어 있으며 취약성을 수정하면 자동으로 업데이트됩니다.

![Dependabot 경고의 타임라인 스크린샷](/assets/images/help/dependabot/dependabot-alert-timeline.png)

## 종속성 보호하기

프로젝트를 빠르고 쉽게 보호하려면 만든 수정 사항을 Dependabot 적용해 보겠습니다.

1. 수정 요약이 포함된 경고 필드에서 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-dependabot" aria-label="dependabot icon" role="img"><path d="M5.75 7.5a.75.75 0 0 1 .75.75v1.5a.75.75 0 0 1-1.5 0v-1.5a.75.75 0 0 1 .75-.75Zm5.25.75a.75.75 0 0 0-1.5 0v1.5a.75.75 0 0 0 1.5 0v-1.5Z"></path><path d="M6.25 0h2A.75.75 0 0 1 9 .75V3.5h3.25a2.25 2.25 0 0 1 2.25 2.25V8h.75a.75.75 0 0 1 0 1.5h-.75v2.75a2.25 2.25 0 0 1-2.25 2.25h-8.5a2.25 2.25 0 0 1-2.25-2.25V9.5H.75a.75.75 0 0 1 0-1.5h.75V5.75A2.25 2.25 0 0 1 3.75 3.5H7.5v-2H6.25a.75.75 0 0 1 0-1.5ZM3 5.75v6.5c0 .414.336.75.75.75h8.5a.75.75 0 0 0 .75-.75v-6.5a.75.75 0 0 0-.75-.75h-8.5a.75.75 0 0 0-.75.75Z"></path></svg> 클릭합니다\*\*\*\*.
2. 끌어오기 요청 페이지에서 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-file-diff" aria-label="file diff icon" role="img"><path d="M1 1.75C1 .784 1.784 0 2.75 0h7.586c.464 0 .909.184 1.237.513l2.914 2.914c.329.328.513.773.513 1.237v9.586A1.75 1.75 0 0 1 13.25 16H2.75A1.75 1.75 0 0 1 1 14.25Zm1.75-.25a.25.25 0 0 0-.25.25v12.5c0 .138.112.25.25.25h10.5a.25.25 0 0 0 .25-.25V4.664a.25.25 0 0 0-.073-.177l-2.914-2.914a.25.25 0 0 0-.177-.073ZM8 3.25a.75.75 0 0 1 .75.75v1.5h1.5a.75.75 0 0 1 0 1.5h-1.5v1.5a.75.75 0 0 1-1.5 0V7h-1.5a.75.75 0 0 1 0-1.5h1.5V4A.75.75 0 0 1 8 3.25Zm-3 8a.75.75 0 0 1 .75-.75h4.5a.75.75 0 0 1 0 1.5h-4.5a.75.75 0 0 1-.75-.75Z"></path></svg>**변경된 파일**을 클릭하여 Dependabot 확인합니다. 변경 내용을 검토한 후 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-comment-discussion" aria-label="comment discussion icon" role="img"><path d="M1.75 1h8.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 10.25 10H7.061l-2.574 2.573A1.458 1.458 0 0 1 2 11.543V10h-.25A1.75 1.75 0 0 1 0 8.25v-5.5C0 1.784.784 1 1.75 1ZM1.5 2.75v5.5c0 .138.112.25.25.25h1a.75.75 0 0 1 .75.75v2.19l2.72-2.72a.749.749 0 0 1 .53-.22h3.5a.25.25 0 0 0 .25-.25v-5.5a.25.25 0 0 0-.25-.25h-8.5a.25.25 0 0 0-.25.25Zm13 2a.25.25 0 0 0-.25-.25h-.5a.75.75 0 0 1 0-1.5h.5c.966 0 1.75.784 1.75 1.75v5.5A1.75 1.75 0 0 1 14.25 12H14v1.543a1.458 1.458 0 0 1-2.487 1.03L9.22 12.28a.749.749 0 0 1 .326-1.275.749.749 0 0 1 .734.215l2.22 2.22v-2.19a.75.75 0 0 1 .75-.75h1a.25.25 0 0 0 .25-.25Z"></path></svg>를 클릭하여 \*\*\*\* 풀 리퀘스트 개요로 돌아갑니다.
3. 수정을 적용하려면 페이지 하단에서 **Merge pull request**를 클릭한 다음, **Confirm merge**를 클릭하세요.

   끌어오기 요청이 병합되면 연결된 Dependabot 경고가 자동으로 닫히고 수정 시간이 타임라인에 추가됩니다.

## 향후 종속성 취약성 방지하기

안전하지 않은 종속성을 방지하기 위해 새 버전이 릴리스될 때 종속성을 업데이트하는 끌어오기 요청을 자동으로 열도록 허용 Dependabot 해 보겠습니다.

1. 리포지토리의 탐색 모음에서 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-gear" aria-label="gear icon" role="img"><path d="M8 0a8.2 8.2 0 0 1 .701.031C9.444.095 9.99.645 10.16 1.29l.288 1.107c.018.066.079.158.212.224.231.114.454.243.668.386.123.082.233.09.299.071l1.103-.303c.644-.176 1.392.021 1.82.63.27.385.506.792.704 1.218.315.675.111 1.422-.364 1.891l-.814.806c-.049.048-.098.147-.088.294.016.257.016.515 0 .772-.01.147.038.246.088.294l.814.806c.475.469.679 1.216.364 1.891a7.977 7.977 0 0 1-.704 1.217c-.428.61-1.176.807-1.82.63l-1.102-.302c-.067-.019-.177-.011-.3.071a5.909 5.909 0 0 1-.668.386c-.133.066-.194.158-.211.224l-.29 1.106c-.168.646-.715 1.196-1.458 1.26a8.006 8.006 0 0 1-1.402 0c-.743-.064-1.289-.614-1.458-1.26l-.289-1.106c-.018-.066-.079-.158-.212-.224a5.738 5.738 0 0 1-.668-.386c-.123-.082-.233-.09-.299-.071l-1.103.303c-.644.176-1.392-.021-1.82-.63a8.12 8.12 0 0 1-.704-1.218c-.315-.675-.111-1.422.363-1.891l.815-.806c.05-.048.098-.147.088-.294a6.214 6.214 0 0 1 0-.772c.01-.147-.038-.246-.088-.294l-.815-.806C.635 6.045.431 5.298.746 4.623a7.92 7.92 0 0 1 .704-1.217c.428-.61 1.176-.807 1.82-.63l1.102.302c.067.019.177.011.3-.071.214-.143.437-.272.668-.386.133-.066.194-.158.211-.224l.29-1.106C6.009.645 6.556.095 7.299.03 7.53.01 7.764 0 8 0Zm-.571 1.525c-.036.003-.108.036-.137.146l-.289 1.105c-.147.561-.549.967-.998 1.189-.173.086-.34.183-.5.29-.417.278-.97.423-1.529.27l-1.103-.303c-.109-.03-.175.016-.195.045-.22.312-.412.644-.573.99-.014.031-.021.11.059.19l.815.806c.411.406.562.957.53 1.456a4.709 4.709 0 0 0 0 .582c.032.499-.119 1.05-.53 1.456l-.815.806c-.081.08-.073.159-.059.19.162.346.353.677.573.989.02.03.085.076.195.046l1.102-.303c.56-.153 1.113-.008 1.53.27.161.107.328.204.501.29.447.222.85.629.997 1.189l.289 1.105c.029.109.101.143.137.146a6.6 6.6 0 0 0 1.142 0c.036-.003.108-.036.137-.146l.289-1.105c.147-.561.549-.967.998-1.189.173-.086.34-.183.5-.29.417-.278.97-.423 1.529-.27l1.103.303c.109.029.175-.016.195-.045.22-.313.411-.644.573-.99.014-.031.021-.11-.059-.19l-.815-.806c-.411-.406-.562-.957-.53-1.456a4.709 4.709 0 0 0 0-.582c-.032-.499.119-1.05.53-1.456l.815-.806c.081-.08.073-.159.059-.19a6.464 6.464 0 0 0-.573-.989c-.02-.03-.085-.076-.195-.046l-1.102.303c-.56.153-1.113.008-1.53-.27a4.44 4.44 0 0 0-.501-.29c-.447-.222-.85-.629-.997-1.189l-.289-1.105c-.029-.11-.101-.143-.137-.146a6.6 6.6 0 0 0-1.142 0ZM11 8a3 3 0 1 1-6 0 3 3 0 0 1 6 0ZM9.5 8a1.5 1.5 0 1 0-3.001.001A1.5 1.5 0 0 0 9.5 8Z"></path></svg> 클릭합니다\*\*\*\*.
2. 사이드바의 "보안" 섹션에서 을 클릭합니다 <svg version="1.1" width="16" height="16" viewBox="0 0 16 16" class="octicon octicon-codescan" aria-label="codescan icon" role="img"><path d="M8.47 4.97a.75.75 0 0 0 0 1.06L9.94 7.5 8.47 8.97a.75.75 0 1 0 1.06 1.06l2-2a.75.75 0 0 0 0-1.06l-2-2a.75.75 0 0 0-1.06 0ZM6.53 6.03a.75.75 0 0 0-1.06-1.06l-2 2a.75.75 0 0 0 0 1.06l2 2a.75.75 0 1 0 1.06-1.06L5.06 7.5l1.47-1.47Z"></path><path d="M12.246 13.307a7.501 7.501 0 1 1 1.06-1.06l2.474 2.473a.749.749 0 0 1-.326 1.275.749.749 0 0 1-.734-.215ZM1.5 7.5a6.002 6.002 0 0 0 3.608 5.504 6.002 6.002 0 0 0 6.486-1.117.748.748 0 0 1 .292-.293A6 6 0 1 0 1.5 7.5Z"></path></svg>**Advanced Security**.
3. "Dependabot version updates" 옆에 있는 **\[사용]** 을 클릭합니다.

## 다음 단계

이제 데모 리포지토리에서 해당 기능을 사용해 Dependabot 보았으므로 사용자 **고유의 프로젝트에서** 종속성 취약성을 쉽게 찾고, 수정하고, 방지할 수 있습니다.