# ウェブ UI とストレージ管理
<a name="web-ui-and-storage-management"></a>

ウェブ UI は [React](https://reactjs.org/) を使用して開発されています。ユーザーがウェブ 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 とストレージ管理コンポーネント** 

![ワークロード検出のウェブ UI ストレージ管理](http://docs.aws.amazon.com/ja_jp/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 関数を使用して、新しいアカウントやリージョンのインポートなどのリクエストを処理します。