翻訳は機械翻訳により提供されています。提供された翻訳内容と英語版の間で齟齬、不一致または矛盾がある場合、英語版が優先します。
AWS でのサーバー側のレンダリングマイクロフロントエンド
公開日: 2022 年 9 月 9 日 (図の履歴)
このアーキテクチャは、サーバーレスアプローチ AWS を使用して でサーバー側のレンダリングマイクロフロントエンドを実装する方法を示しています。すべてのサーバーレスマイクロフロントエンドは HTML フラグメント (HTML-on-the-wire) を返し、UI コンポーザーはこれらの独立した部分を結合して、ユーザーにシームレスなエクスペリエンスを提供します。
AWS でのサーバー側のレンダリングマイクロフロントエンド
次の手順では、アーキテクチャについて説明します。
-
Amazon CloudFront は、Amazon Simple Storage Service バケットとパブリック Application Load Balancer の 2 つのオリジンを持つエントリポイントとして機能します。
-
Amazon S3 バケットには、一般的なマイクロフロントエンドの依存関係、イメージ、CSS ファイルなど、ブラウザのすべての静的ファイルが含まれています。また、UI コンポーザーが HTML ページにすべてのマイクロフロントエンドを配置するために使用するテンプレートも含まれています。
-
UI コンポーザーは AWS Fargate クラスターで実行され、さまざまなマイクロフロントエンドを結合して、レスポンスをストリーミングしてパフォーマンスを向上させます。Amazon ElastiCache を使用してマイクロフロントエンド出力またはページ全体をキャッシュし、パフォーマンスを向上させます。
-
AWS Systems Manager パラメータストアを使用して、すべてのマイクロサービスエンドポイントを収集します。HTTP エンドポイントまたは Amazon リソースネーム (ARNs) で、チームレベルの依存関係を分離できます。
-
サーバーレスマイクロフロントエンドは、 AWS Lambdaと Amazon DynamoDB を使用してデータを保存し、UI コンポーザーテンプレートに埋め込む準備ができている HTML フラグメントをレンダリングします。
-
サードパーティーのマイクロフロントエンドの場合、Amazon API Gateway を使用してトークンまたは API キーを検証し、アプリケーションのみがそのエンドポイントにアクセスできることを確認します。
-
AWS Step Functions Express をマイクロフロントエンドを生成するためのローコードソリューションとして使用します。Step Functions は 200 を超えるサービスと統合して計算を減らし、DynamoDB からデータをネイティブに取得し、レンダリングを Lambda 関数に委任します。
詳細情報
詳細については、次のリソースを参照してください。
図の履歴
このリファレンスアーキテクチャ図の更新について通知を受け取るには、RSS フィードをサブスクライブします。
| 変更 | 説明 | 日付 |
|---|---|---|
初版発行 | リファレンスアーキテクチャ図が最初に公開されました。 | 2022 年 9 月 9 日 |
注記
RSS 更新をサブスクライブするには、使用しているブラウザで RSS プラグインが有効になっている必要があります。
