本文為英文版的機器翻譯版本，如內容有任何歧義或不一致之處，概以英文版為準。

# AWS App Studio 的運作方式
<a name="how-it-works"></a>

使用 AWS App Studio 建置應用程式時，需要了解幾個關鍵概念。本主題涵蓋下列概念或資源的基本概念：
+ 使用*連接器*連接到其他服務，在您的應用程式中使用其資源或 API 呼叫。例如，您可以使用連接器來存放和存取資料，或從應用程式傳送通知。
+ 使用*實體*來設定應用程式的資料模型，將應用程式與外部資料來源連線。
+ 使用*頁面*和*元件*來建置應用程式的使用者介面 (UI)。
+ 使用*自動化*和*動作*來實作應用程式的邏輯或行為。
+ App Studio 中的應用程式開發生命週期：建置、測試和發佈。

如需 App Studio 概念的詳細資訊，請參閱 [AWS App Studio 概念](concepts.md)。

下圖是如何組織 App Studio 及其資源的簡單圖表。

![顯示 App Studio 應用程式中資源組織的簡單圖表。](http://docs.aws.amazon.com/zh_tw/appstudio/latest/userguide/images/app-studio-diagram.png)


在 App Studio 中的應用程式中，頁面、自動化和實體都會彼此互動。您可以使用連接器將這些資源連接到外部服務，例如資料、儲存或通知供應商。若要成功建置應用程式，請務必了解所有這些概念和資源如何彼此互動。

## 將您的應用程式連線至其他 服務
<a name="how-it-works-connectors"></a>

使用 App Studio 建置應用程式的最大好處之一是能夠輕鬆整合您的應用程式與其他 服務。在 App Studio 中，您可以使用服務特有的連接器，以及您想要與應用程式搭配使用的資源或 API 呼叫，來連線至其他 服務。

您可以在 App Studio 執行個體層級建立連接器，而不是在個別應用程式中建立連接器。建立連接器後，您可以根據連線的服務和應用程式，在應用程式的各個部分使用連接器。

以下是使用連接器連線至其他 服務之應用程式中的功能範例：
+ 幾乎所有應用程式中使用的最常見使用案例，是透過連線至 Amazon Redshift、Amazon DynamoDB 或 Amazon Aurora 等資料服務來存放和存取應用程式中使用 AWS 的資料。
+ 允許上傳和檢視影像的應用程式，例如收據，可以使用 Amazon S3 來存放和存取影像檔案。
+ 文字摘要器應用程式可以將文字輸入傳送至 Amazon Bedrock，並顯示傳回的摘要。

**注意**  
您必須在 App Studio 中具有管理員角色，才能建立連接器。建立連接器時，您必須包含您要使用的資源或 API 呼叫的相關適當登入資料和資訊。

## 設定應用程式的資料模型
<a name="how-it-works-data-entities"></a>

您應用程式的資料是支援應用程式的資訊。在 App Studio 中，您可以建立和使用代表存放和使用之不同資料類型的*實體*。例如，在客戶會議的追蹤應用程式中，您可能有三個實體代表客戶會議、議程和出席者。

實體包含的欄位類型描述要存放的資料，例如整數或字串。雖然您使用實體來定義資料模型，但您必須將實體連線至外部資料儲存服務，例如 Amazon Redshift 或 Amazon DynamoDB 來儲存資料。您可以將實體視為 App Studio 應用程式與外部服務中資料之間的媒介。

您可以使用資料動作，從元件和自動化與應用程式中的資料互動。要使用的兩個最常見的資料動作是`getAll`動作和`getByID`動作。例如，您的應用程式可以使用`getAll`資料動作將資料填入資料表，並使用`getByID`動作將特定資料輸入的詳細資訊填入詳細資訊元件。

您也可以將範例資料新增至實體，以更輕鬆地測試應用程式，而無需呼叫外部服務。

## 建置應用程式的 UI
<a name="how-it-works-pages-components"></a>

在 App Studio 中，您可以使用*頁面*和*元件*建置應用程式的 UI。頁面是應用程式的個別畫面，也是元件的容器。元件是您應用程式 UI 的建置區塊。元件有許多類型，例如資料表、表單、影像檢視器和按鈕。

下圖顯示應用程式工作室的**分頁**，您可以在其中新增或設定應用程式中的頁面和元件。下列關鍵區域會反白顯示並編號：

1. 左側**分頁**面板。這是您管理頁面、應用程式標頭和導覽設定的地方。您可以檢視應用程式的所有頁面和元件。

1. 畫**布**，顯示目前頁面的元件。您可以選擇畫布中的元件來設定其屬性。

1. 右側**元件**或**屬性**面板。如果未選取任何項目，則會顯示元件面板，其中會顯示可新增至頁面的元件清單。如果您選取頁面或元件，則會顯示屬性面板，您可以在其中設定頁面或元件。

1. 底部的**錯誤**和**警告**面板。這些面板會在您的應用程式中顯示任何錯誤或警告，這最常見於組態問題。您可以選擇面板來展開它，並查看訊息。

![編輯應用程式時顯示之應用程式工作室頁面索引標籤的檢視。](http://docs.aws.amazon.com/zh_tw/appstudio/latest/userguide/images/pages-components.png)


例如，使用者必須輸入資訊的應用程式可能具有下列頁面和元件：
+ 輸入頁面，其中包含使用者用來填寫和提交資訊的表單元件。
+ 包含資料表元件的清單檢視頁面，其中包含每個輸入的相關資訊。
+ 詳細檢視頁面，其中包含詳細資訊元件，其中包含每個輸入的詳細資訊。

元件可以包含靜態資訊或資料，例如具有定義欄位的表單。它們也可以使用自動化來包含動態資訊，例如從 Amazon S3 儲存貯體擷取影像並將其顯示給使用者的影像檢視器。

請務必了解*頁面參數*的概念。您可以使用頁面參數，將資訊從一個頁面傳送到另一個頁面。頁面參數的使用案例的常見範例是搜尋和篩選，其中從一個頁面的搜尋詞彙會傳送到另一個頁面中要篩選的項目表格或清單。另一個使用案例範例是檢視項目詳細資訊，其中項目識別符會傳送到詳細的檢視器頁面。

## 實作應用程式的邏輯或行為
<a name="how-it-works-automations-actions"></a>

您可以將應用程式的邏輯或行為視為應用程式的功能。您可以定義當使用者選擇按鈕、提交資訊、導覽至新頁面或以其他方式互動時會發生的情況。在 App Studio 中，您可以使用*自動化*和*動作*來定義應用程式的邏輯。自動化是 動作的容器，這是自動化功能的建置區塊。

下圖顯示應用程式工作室的**自動化**索引標籤，您可以在其中新增或設定自動化及其在應用程式中的動作。下列關鍵區域會反白顯示並編號：
+ 左側**自動化**面板。這是您管理自動化的地方。您可以檢視應用程式的所有自動化和動作。
+ 畫**布**，會顯示目前的自動化。它會顯示設定的自動化參數 （本節稍後說明） 和 動作。您可以選擇畫布中的元件來設定其屬性。
+ 右側**動作**和**屬性**面板。如果未選取任何項目，則會顯示動作面板。它會顯示可新增至自動化的動作清單。如果您選擇自動化，您可以檢視和設定其屬性，例如自動化的輸入和輸出。如果您選擇動作，您可以檢視和設定動作的屬性。
+ 底部的**錯誤**和**警告**面板。此面板會顯示應用程式中的任何錯誤或警告 （通常來自組態問題）。您可以選擇面板來展開它，並查看訊息。

![應用程式工作室的自動化索引標籤，您可以在其中建立、設定和管理自動化和動作，同時編輯應用程式。](http://docs.aws.amazon.com/zh_tw/appstudio/latest/userguide/images/automations-actions.png)


自動化可以很簡單 （例如新增數字並傳回結果），也可以更強大 （例如將輸入傳送至另一個 服務並傳回結果）。自動化的主要元件如下：
+ *觸發*，定義自動化執行的時間。例如，當使用者在 UI 中按下按鈕時。
+ *自動化輸入*，會將資訊傳送至自動化。您可以使用自動化*參數定義自動化*輸入。例如，如果您想要使用 Amazon Bedrock 將文字摘要傳回給使用者，您可以將文字設定為摘要為自動化參數。
+ *動作*，這是自動化功能的建置區塊。您可以將每個動作視為自動化中的一個步驟。動作可以呼叫 APIs、叫用自訂 JavaScript、建立資料記錄，以及執行其他 函數。您也可以將動作分組為迴圈或條件，以進一步自訂功能。您也可以使用 動作叫用其他自動化。
+ *自動化輸出*，您可以在元件或其他自動化中使用。例如，自動化輸出可以是文字元件中顯示的文字、影像檢視器元件中顯示的影像，或其他自動化的輸入。

## 應用程式的開發生命週期
<a name="how-it-works-development-lifecycle"></a>

應用程式的開發生命週期包括下列階段：建置、測試和發佈。它稱為循環，因為您在建立和迭代應用程式時，可能會在這些階段之間反覆執行。

下圖顯示 App Studio 中應用程式開發生命週期的簡化時間表：

![應用程式開發生命週期的時間軸圖表，包括建置、預覽、測試、生產和共用。](http://docs.aws.amazon.com/zh_tw/appstudio/latest/userguide/images/app-studio-development-lifecycle.png)


App Studio 提供各種工具來支援應用程式的生命週期。這些工具包括以下三種不同的環境，如上圖所示：
+ 預覽環境，您可以在其中預覽您的應用程式，查看它對最終使用者的外觀，並測試特定功能。使用預覽環境在應用程式上快速測試和迭代，而不需要發佈。預覽環境中的應用程式不會與外部服務通訊或傳輸資料。這表示您無法測試在預覽環境中依賴外部服務的互動和功能。
+ 測試環境，您可以在其中測試應用程式的連線以及與外部服務的互動。您也可以將發佈至測試環境的版本分享給測試人員群組，藉此執行最終使用者測試。
+ 生產環境，您可以在其中對新應用程式執行最終測試，然後再與最終使用者共用。共用應用程式後，發佈至生產環境的應用程式版本即為最終使用者將檢視和使用的版本。

## 進一步了解
<a name="how-it-works-learn-more"></a>

現在您已了解應用程式開發如何在 App Studio 中運作的基本概念，您可以開始建置自己的應用程式，或深入了解概念和資源。

若要開始建置，建議您嘗試其中一個入門教學課程：
+ 遵循 以[教學課程：使用 AI 產生應用程式](getting-started-tutorial-ai.md)了解如何使用 AI 建置器助理來開始建置應用程式。
+ 遵循 以[教學課程：從空白應用程式開始建置](getting-started-tutorial-empty.md)了解如何從頭開始建置應用程式，同時了解基本概念。

若要進一步了解本主題提及的資源或概念，請參閱下列主題：
+ [使用連接器將 App Studio 連接至其他 服務](connectors.md)
+ [實體和資料動作：設定應用程式的資料模型](data.md)
+ [頁面和元件：建置應用程式的使用者介面](pages-components-ux.md)
+ [自動化和動作：定義應用程式的商業邏輯](automations.md)
+ [預覽、發佈和共用應用程式](applications-preview-publish-share.md)