기계 번역으로 제공되는 번역입니다. 제공된 번역과 원본 영어의 내용이 상충하는 경우에는 영어 버전이 우선합니다.

# 웹 UI 및 스토리지 관리
<a name="web-ui-and-storage-management"></a>

[React](https://reactjs.org/)를 사용하여 웹 UI를 개발했습니다. 웹 UI는 사용자가 AWS의 워크로드 검색과 상호 작용할 수 있는 프런트엔드 콘솔을 제공합니다.

 [Amazon CloudFront](https://docs.aws.amazon.com/AmazonCloudFront/latest/DeveloperGuide/Introduction.html)는 웹 UI에 대한 모든 HTTP 요청에 보안 헤더를 추가하도록 구성되어 있습니다. 이를 통해 추가 보안 계층을 제공하여 [교차 사이트 스크립팅](https://docs.aws.amazon.com/waf/latest/developerguide/waf-rule-statement-type-xss-match.html)(XSS)과 같은 공격으로부터 보호합니다.

 **AWS 웹 UI 및 스토리지 관리 구성 요소의 워크로드 검색** 

![워크로드 검색 Webui 스토리지 관리](http://docs.aws.amazon.com/ko_kr/solutions/latest/workload-discovery-on-aws/images/workload-discovery-webui-storage-management.png)


웹 UI 리소스는 `WebUIBucket` Amazon S3 버킷에서 호스팅되고 Amazon CloudFront에서 배포됩니다. AWS Amplify는 AWS AppSync 및 Amazon S3에 대한 통합을 간소화하는 추상화 계층을 제공합니다.

이 솔루션은 AWS AppSync를 사용하여 가져온 리전 관리를 포함하여 AWS에서 워크로드 검색에 사용할 수 있는 다양한 구성과의 상호 작용을 용이하게 합니다. AWS AppSync는 `Settings` AWS Lambda 함수를 사용하여 새 계정 또는 리전 가져오기와 같은 요청을 처리합니다.