<!--
CO_OP_TRANSLATOR_METADATA:
{
  "original_hash": "f23a868536c07da991b1d4e773161e25",
  "translation_date": "2025-08-24T00:15:35+00:00",
  "source_file": "7-bank-project/4-state-management/assignment.md",
  "language_code": "ko"
}
-->
# "거래 추가" 대화상자 구현

## 지침

우리 은행 앱에는 아직 중요한 기능이 하나 부족합니다: 새로운 거래를 입력할 수 있는 기능입니다. 이전 네 가지 레슨에서 배운 모든 것을 활용하여 "거래 추가" 대화상자를 구현하세요:

- 대시보드 페이지에 "거래 추가" 버튼을 추가하세요.
- HTML 템플릿을 사용하여 새 페이지를 만들거나, JavaScript를 사용하여 대시보드 페이지를 떠나지 않고 대화상자 HTML을 표시/숨기는 방법을 구현하세요. 이를 위해 [`hidden`](https://developer.mozilla.org/docs/Web/HTML/Global_attributes/hidden) 속성이나 CSS 클래스를 사용할 수 있습니다.
- 대화상자를 위한 [키보드 및 화면 읽기 접근성](https://developer.paciellogroup.com/blog/2018/06/the-current-state-of-modal-dialog-accessibility/)을 반드시 처리하세요.
- 입력 데이터를 받을 HTML 폼을 구현하세요.
- 폼 데이터를 JSON 데이터로 변환하여 API에 전송하세요.
- 새로운 데이터로 대시보드 페이지를 업데이트하세요.

[서버 API 사양](../api/README.md)을 확인하여 호출해야 할 API와 예상되는 JSON 형식을 확인하세요.

다음은 과제를 완료한 후의 예시 결과입니다:

![예시 "거래 추가" 대화상자를 보여주는 스크린샷](../../../../7-bank-project/4-state-management/images/dialog.png)

## 평가 기준

| 기준      | 모범적                                                                                          | 적절함                                                                                                                | 개선 필요                                    |
| --------- | ----------------------------------------------------------------------------------------------- | --------------------------------------------------------------------------------------------------------------------- | --------------------------------------------|
|           | 거래 추가가 레슨에서 배운 모든 모범 사례를 따라 완벽하게 구현되었습니다.                          | 거래 추가가 구현되었지만 레슨에서 배운 모범 사례를 따르지 않거나 부분적으로만 작동합니다.                              | 거래 추가가 전혀 작동하지 않습니다.          |

**면책 조항**:  
이 문서는 AI 번역 서비스 [Co-op Translator](https://github.com/Azure/co-op-translator)를 사용하여 번역되었습니다. 정확성을 위해 최선을 다하고 있지만, 자동 번역에는 오류나 부정확성이 포함될 수 있습니다. 원본 문서를 해당 언어로 작성된 상태에서 권위 있는 자료로 간주해야 합니다. 중요한 정보의 경우, 전문적인 인간 번역을 권장합니다. 이 번역 사용으로 인해 발생하는 오해나 잘못된 해석에 대해 당사는 책임을 지지 않습니다.