Amazon CodeCatalyst 不再向新客戶開放。現有客戶可以繼續正常使用該服務。如需詳細資訊，請參閱[如何從 CodeCatalyst 遷移](migration.md)。

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

# CodeCatalyst 來源儲存庫和單頁應用程式藍圖入門
<a name="source-getting-started"></a>

遵循本教學課程中的步驟，了解如何在 Amazon CodeCatalyst 中使用來源儲存庫。

開始使用 Amazon CodeCatalyst 中來源儲存庫的最快方法是使用範本建立專案。當您使用範本建立專案時，會為您建立資源，包括包含範本程式碼的來源儲存庫。您可以使用此儲存庫和程式碼範例來了解如何：
+ 檢視專案的來源儲存庫並瀏覽其內容
+ 使用您可以處理程式碼的新分支建立開發環境
+ 變更檔案，並遞交和推送變更
+ 建立提取請求，並與其他專案成員檢閱您的程式碼變更
+ 請參閱專案的工作流程，自動建置並測試提取請求來源分支中的變更
+ 將您的變更從來源分支合併到目的地分支，然後關閉提取請求
+ 查看自動建置和部署的合併變更

若要充分利用本教學課程，請邀請其他人加入您的專案，以便您可以一起處理提取請求。您也可以探索 CodeCatalyst 中的其他功能，例如建立問題並將其與提取請求建立關聯，或設定通知，並在相關聯的工作流程執行時收到提醒。如需 CodeCatalyst 的完整探索，請參閱[入門教學課程](getting-started-topnode.md)。

## 使用藍圖建立專案
<a name="source-getting-started-proj-create"></a>

建立專案是能夠一起工作的第一步。您可以使用藍圖來建立專案，該專案也會建立具有範本程式碼的來源儲存庫，以及在您變更程式碼時自動建置和部署程式碼的工作流程。在本教學課程中，我們將引導您完成使用**單頁應用程式**藍圖建立的專案，但您可以使用來源儲存庫遵循任何專案的程序。如果您在建立專案時沒有 IAM 角色，請務必選擇 IAM 角色或新增 IAM 角色。我們建議您為此專案使用 **CodeCatalystWorkflowDevelopmentRole-*spaceName***服務角色。

如果您已有專案，可以直接跳到 [檢視專案的儲存庫](#source-getting-started-source-view)。

**注意**  
只有具有 Space 管理員或 **Power 使用者**角色的使用者才能在 CodeCatalyst 中建立專案。如果您沒有此角色，而且需要專案才能進行本教學課程，請具有這些角色之一的人員為您建立專案，並將您新增至建立的專案。如需詳細資訊，請參閱[使用使用者角色授予存取權](ipa-roles.md)。

**使用藍圖建立專案**

1. 在 CodeCatalyst 主控台中，導覽至您要建立專案的空間。

1. 在空間儀表板上，選擇**建立專案**。

1. 選擇**從藍圖開始**。
**提示**  
您可以選擇為 **Amazon Q** 提供專案要求來新增藍圖，讓 Amazon Q 向您建議藍圖。如需詳細資訊，請參閱[建立專案或新增功能時，使用 Amazon Q 選擇藍圖](getting-started-project-assistance.md#getting-started-project-assistance-create-apply-bp)及[使用 Amazon Q 建立專案或新增具有藍圖的功能時的最佳實務](projects-create.md#projects-create-amazon-q)。此功能僅適用於美國西部 （奧勒岡） 區域。  
此功能需要為空間啟用生成式 AI 功能。如需詳細資訊，請參閱[管理生成式 AI 功能](https://docs.aws.amazon.com/codecatalyst/latest/adminguide/managing-generative-ai-features.html)。

1. 從 **CodeCatalyst 藍圖**或**空間藍圖**索引標籤中，選擇藍圖，然後選擇**下一步**。

1. 在**為您的專案命名**下，輸入您要指派給專案的名稱及其相關聯的資源名稱。名稱在您的空間中必須是唯一的。

1. （選用） 根據預設，藍圖建立的原始碼會存放在 CodeCatalyst 儲存庫中。或者，您可以選擇將藍圖的原始程式碼存放在第三方儲存庫中。如需詳細資訊，請參閱[在 CodeCatalyst 中將功能新增至具有擴充功能的專案將功能新增至具有擴充功能的專案](extensions.md)。
**重要**  
CodeCatalyst 不支援偵測連結儲存庫的預設分支中的變更。若要變更連結儲存庫的預設分支，您必須先將其從 CodeCatalyst 取消連結、變更預設分支，然後再次連結。如需詳細資訊，請參閱[在 CodeCatalyst 中連結 GitHub 儲存庫、Bitbucket 儲存庫、GitLab 專案儲存庫和 Jira 專案](extensions-link.md)。  
最佳實務是，在連結儲存庫之前，請務必確保您擁有最新版本的擴充功能。

   根據您要使用的第三方儲存庫提供者，執行下列其中一項操作：
   + **GitHub 儲存庫**：連接 GitHub 帳戶。

     選擇**進階**下拉式選單，選擇 GitHub 做為儲存庫提供者，然後選擇您要存放藍圖所建立來源碼的 GitHub 帳戶。
**注意**  
如果您要連接 GitHub 帳戶，則必須建立個人連線，以在 CodeCatalyst 身分和 GitHub 身分之間建立身分映射。如需詳細資訊，請參閱[個人連線](concepts.md#personal-connection-concept)及[使用個人連線存取 GitHub 資源](ipa-settings-connections.md)。
   + **Bitbucket 儲存庫**：連接 Bitbucket 工作區。

     選擇**進階**下拉式功能表，選擇 Bitbucket 做為儲存庫提供者，然後選擇您要存放藍圖所建立原始碼的 Bitbucket 工作區。
   + **GitLab 儲存庫**：連接 GitLab 使用者。

     選擇**進階**下拉式功能表，選擇 GitLab 做為儲存庫提供者，然後選擇您要存放藍圖所建立原始碼的 GitLab 使用者。

1. 在**專案資源**下，設定藍圖參數。根據藍圖，您可以選擇命名來源儲存庫名稱。

1. （選用） 若要根據您所做的專案參數選擇來檢視具有更新的定義檔案，請選擇從**產生專案預覽****中檢視程式碼**或**檢視工作流程**。

1. （選用） 從藍圖的卡片選擇**檢視詳細資訊**，以檢視藍圖的特定詳細資訊，例如藍圖架構的概觀、必要的連線和許可，以及藍圖建立的資源類型。

1. 選擇**建立專案**。

專案概觀頁面會在您建立專案或接受專案邀請並完成登入程序後立即開啟。新專案的專案概觀頁面不包含未解決的問題或提取請求。您可以選擇建立問題並將其指派給自己。您也可以選擇邀請其他人加入您的專案。如需詳細資訊，請參閱[在 CodeCatalyst 中建立問題](issues-create-issue.md)及[邀請使用者加入專案](projects-members.md#projects-members-add)。

## 檢視專案的儲存庫
<a name="source-getting-started-source-view"></a>

身為專案的成員，您可以檢視專案的來源儲存庫。您也可以選擇建立其他儲存庫。如果具有 **Space 管理員**角色的人員已安裝並設定 **GitHub 儲存庫**、**Bitbucket 儲存庫**或 **GitLab 儲存庫**延伸，您也可以在 GitHub 帳戶、Bitbucket 工作區或針對延伸設定的 GitLab 使用者中新增第三方儲存庫的連結。如需詳細資訊，請參閱[建立來源儲存庫](source-repositories-create.md)及[快速入門：在 CodeCatalyst 中安裝擴充功能、連線供應商和連結資源](extensions-quickstart.md)。

**注意**  
對於使用單頁應用程式藍圖建立的專案，包含範本程式碼的來源儲存庫的預設名稱為 ***spa-app***。

**導覽至專案的來源儲存庫**

1. 導覽至您的專案，並執行下列其中一項操作：
   + 在專案的摘要頁面上，從清單中選擇您想要的儲存庫，然後選擇**檢視儲存庫**。
   + 在導覽窗格中，選擇**程式碼**，然後選擇**來源儲存庫**。在**來源儲存庫**中，從清單中選擇儲存庫的名稱。您可以在篩選列中輸入部分儲存庫名稱，以篩選儲存庫清單。

1. 在儲存庫的首頁上，檢視儲存庫的內容，以及有關相關資源的資訊，例如提取請求和工作流程的數量。預設會顯示預設分支的內容。您可以從下拉式清單中選擇不同的分支來變更檢視。

儲存庫的概觀頁面包含針對此儲存庫分支及其檔案設定的工作流程和提取請求的相關資訊。如果您剛建立專案，建置、測試和部署程式碼的初始工作流程仍會持續執行，因為它們需要幾分鐘的時間才能完成。您可以選擇相關工作流程下方的數字來檢視**相關工作流程**及其狀態，但這會在 **CI/CD** 中開啟**工作流程**頁面。在本教學課程中，請保留在概觀頁面上，並探索儲存庫中的程式碼。`README.md` 檔案的內容會在此頁面的儲存庫檔案下方轉譯。在 **檔案**中，會顯示預設分支的內容。如果您有其他分支的內容，您可以變更檔案檢視以顯示該分支的內容。`.codecatalyst` 資料夾包含用於專案其他部分的程式碼，例如工作流程 YAML 檔案。

若要檢視資料夾的內容，請選擇資料夾名稱旁的箭頭來展開資料夾。例如，選擇旁邊的箭頭`src`，以檢視該資料夾中包含的單頁 Web 應用程式的檔案。若要檢視檔案的內容，從清單中選擇檔案。這會開啟**檢視檔案**，您可以在其中瀏覽多個檔案的內容。您也可以在主控台中編輯單一檔案，但若要編輯多個檔案，您需要建立開發環境。

## 建立開發環境
<a name="source-getting-started-source-add"></a>

您可以在 Amazon CodeCatalyst 主控台的來源儲存庫中新增和變更檔案。不過，為了有效處理多個檔案和分支，我們建議您使用開發環境或將儲存庫複製到本機電腦。在本教學課程中，我們將使用名為 的分支建立 AWS Cloud9 開發環境**develop**。您可以選擇不同的分支名稱，但透過命名分支 **develop**，工作流程會在您稍後在本教學課程中建立提取請求時自動執行，以建置和測試您的程式碼。

**提示**  
如果您決定在本機複製儲存庫，而不是使用開發環境或除了使用開發環境之外，請確定您的本機電腦上有 Git，或您的 IDE 包含 Git。如需詳細資訊，請參閱[設定 以使用來源儲存庫](source-setting-up.md)。

**使用新分支建立開發環境**

1. 在 https：//[https://codecatalyst.aws/](https://codecatalyst.aws/) 開啟 CodeCatalyst 主控台。

1. 導覽至您要建立開發環境的專案。

1. 從專案的來源儲存庫清單中選擇儲存庫的名稱。或者，在導覽窗格中，選擇**程式碼**、選擇**來源儲存庫**，然後選擇您要為其建立開發環境的儲存庫。

1. 在儲存庫首頁上，選擇**建立開發環境**。

1. 從下拉式選單中選擇支援的 IDE。如需詳細資訊，請參閱[支援開發環境的整合式開發環境](devenvironment-create.md#devenvironment-supported-ide)。

1. 選擇要複製的儲存庫，選擇在**新分支中工作**，在**分支名稱**欄位中輸入分支名稱，然後從從建立分支下拉式功能表中選擇要建立新**分支**的分支。

1. 或者，為開發環境新增別名。

1. 或者，選擇**開發環境組態**編輯按鈕，以編輯開發環境的運算、儲存或逾時組態。

1. 選擇**建立**。建立開發環境時，開發環境狀態欄會顯示**開始**，而狀態欄會在建立開發環境後顯示**執行**中。在您選擇的 IDE 中，新的索引標籤將隨您的開發環境開啟。您可以編輯程式碼並遞交和推送變更。

建立開發環境後，您可以編輯檔案、遞交變更，並將變更推送至**test**分支。在本教學課程中，編輯 `src` 資料夾中`App.tsx`的`<p>`標籤之間的內容，以變更網頁上顯示的文字。遞交並推送您的變更，然後返回 CodeCatalyst 索引標籤。

## 從 AWS Cloud9 開發環境進行和推送變更


1. 在 中 AWS Cloud9，展開側邊導覽選單以瀏覽檔案。展開 `src`，然後開啟 `App.tsx`。

1. 變更`<p>`標籤內的文字。

1. 儲存檔案，然後使用 Git 功能表遞交和推送您的變更。或者，在終端機視窗中，使用 和 **git push**命令遞交**git commit**並推送您的變更。

   ```
   git commit -am "Making an example change"
   git push
   ```
**提示**  
您可能需要將終端機中的目錄變更為 Git 儲存庫目錄，才能成功執行 Git 命令。

## 建立提取請求
<a name="source-getting-started-pull-request"></a>

您可以使用提取請求，針對發行軟體的次要變更或修正、主要功能新增或新版本，協同檢閱程式碼變更。在本教學課程中，您將建立提取請求，以檢閱與**主要**分支相比您對*測試*分支所做的變更。在以範本建立的專案中建立提取請求，也會開始執行其相關聯的工作流程，如果有的話。

**建立提取請求**

1. 導覽至您的專案。

1. 執行以下任意一項：
   + 在導覽窗格中，選擇**程式碼**，選擇**提取請求**，然後選擇**建立提取請求**。
   + 在儲存庫首頁上，選擇**更多**，然後選擇**建立提取請求**。
   + 在專案頁面上，選擇**建立提取請求**。

1. 在**來源儲存庫**中，請確定指定的來源儲存庫包含遞交的程式碼。只有在您未從儲存庫的主頁面建立提取請求時，才會顯示此選項。

1. 在**目的地分支**中，選擇要在檢閱程式碼之後將程式碼合併到其中的分支。

1. 在**來源分支**中，選擇包含遞交程式碼的分支。

1. 在**提取請求標題**中，輸入標題，以協助其他使用者了解需要檢閱的內容及其原因。

1. （選用） 在**提取請求描述**中，提供問題連結或變更描述等資訊。
**提示**  
您可以選擇**寫入描述，**讓 CodeCatalyst 自動產生提取請求中包含的變更描述。您可以在將自動產生的描述新增至提取請求之後對其進行變更。  
此功能需要為空間啟用生成式 AI 功能，且不適用於連結儲存庫中的提取請求。如需詳細資訊，請參閱[管理生成式 AI 功能](https://docs.aws.amazon.com/codecatalyst/latest/adminguide/managing-generative-ai-features.html)。

1. （選用） 在**問題**中，選擇**連結問題**，然後從清單中選擇問題或輸入其 ID。若要取消連結問題，請選擇取消連結圖示。

1. （選用） 在**必要檢閱者**中，選擇**新增必要檢閱者**。從專案成員清單中選擇以新增成員。必要的檢閱者必須先核准變更，才能將提取請求合併到目的地分支。
**注意**  
您無法將檢閱者同時新增為必要檢閱者和選用檢閱者。您無法將自己新增為檢閱者。

1. （選用） 在**選用檢閱者**中，選擇**新增選用檢閱者**。從專案成員清單中選擇以新增成員。在提取請求可以合併到目的地分支之前，選用檢閱者不需要核准變更。

1. 檢閱分支之間的差異。提取請求中顯示的差異是來源分支中的修訂與合併基礎之間的變更，這是建立提取請求時目的地分支的前端遞交。如果沒有顯示任何變更，則分支可能相同，或者您可能已為來源和目的地選擇相同的分支。

1. 當您滿意提取請求包含您想要檢閱的程式碼和變更時，請選擇**建立**。
**注意**  
建立提取請求之後，您可以新增註解。評論可以新增到提取請求或檔案中的個別行，以及整體提取請求。您可以使用 @ 符號加上檔案名稱，以新增資源的連結，例如檔案。

您可以選擇**概觀**，然後檢閱工作流程執行下的**提取請求詳細資訊**區域中的資訊，以檢視建立此提取請求時啟動的相關聯工作流程的相關資訊。 ****若要檢視工作流程執行，請選擇執行。

**提示**  
如果您將分支命名為 以外的項目**develop**，工作流程就不會自動執行來建置和測試您的變更。如果您想要設定，請編輯 **onPullRequestBuildAndTest** 工作流程的 YAML 檔案。如需詳細資訊，請參閱[建立工作流程](workflows-create-workflow.md)。

您可以對此提取請求進行評論，並要求其他專案成員對其進行評論。您也可以選擇新增或變更選用或必要檢閱者。您可以選擇對儲存庫的來源分支進行更多變更，並查看這些遞交的變更如何為提取請求建立修訂。如需詳細資訊，請參閱 [檢閱提取請求](pull-requests-review.md)、[在 Amazon CodeCatalyst 中使用提取請求檢閱程式碼](source-pull-requests.md)、 [更新提取請求](pull-requests-update.md)和 [檢視工作流程執行狀態和詳細資訊](workflows-view-run.md) 。

## 合併提取請求
<a name="source-getting-started-merge-pull-request"></a>

提取請求經過審核並獲得必要審核者的核准後，您就可以將其來源分支合併到 CodeCatalyst 主控台中的目的地分支。合併提取請求也會透過與目的地分支相關聯的任何工作流程開始執行變更。在本教學課程中，您會將測試分支合併為主要分支，這會開始執行 **onPushToMainDeployPipeline** 工作流程。

**合併提取請求 （主控台）**

1. 在**提取請求**中，選擇您在上一個步驟中建立的提取請求。在提取請求中，選擇**合併**。

1. 從提取請求的可用合併策略中選擇。選擇性地選取或取消選取在合併提取請求後刪除來源分支的選項，然後選擇**合併**。合併完成後，提取請求的狀態會變更為**合併**，且不會再出現在提取請求的預設檢視中。預設檢視會顯示狀態為 **Open** 的提取請求。您仍然可以檢視合併的提取請求，但無法核准它或變更其狀態。
**注意**  
如果**合併**按鈕未處於作用中狀態，或者您看到**不可合併**標籤，則所需的檢閱者尚未核准提取請求，或提取請求無法在 CodeCatalyst 主控台中合併。尚未核准提取請求的檢閱者會在**提取請求詳細資訊**區域中的**概觀**中以時鐘圖示表示。如果所有必要的檢閱者都已核准提取請求，但**合併**按鈕仍處於非作用中狀態，則可能會發生合併衝突，或者您已超過空間的儲存配額。您可以解決開發環境中目的地分支的合併衝突、推送變更，然後合併提取請求，也可以解決衝突並在本機合併，然後將包含合併的遞交推送至 CodeCatalyst。如需詳細資訊，請參閱 [合併提取請求 (Git)](pull-requests-merge.md#pull-requests-merge-git)和您的 Git 文件。

## 檢視部署的程式碼
<a name="source-getting-started-view-workflow-results"></a>

現在，您可以檢視預設分支中最初部署的程式碼，並在自動建置、測試和部署合併程式碼後進行變更。若要這樣做，您可以返回儲存庫的概觀頁面，然後選擇相關工作流程圖示旁的號碼，或在導覽窗格中，選擇 **CI/CD**，然後選擇**工作流程**。

**檢視部署的程式碼**

1. 在**工作流程**的 中`onPushToMainDeployPipeline`，展開**最近執行**。
**注意**  
這是使用**單頁應用程式**藍圖建立之專案的工作流程預設名稱。

1. 最近的執行是合併提取請求遞交至`main`分支時啟動的執行，可能會顯示**進行中**的狀態。從清單中選擇成功完成的執行，以開啟該執行的詳細資訊。

1. 選擇**變數**。複製 **AppURL** 的值。這是已部署的單一頁面 Web 應用程式的 URL。開啟新的瀏覽器索引標籤並貼入 值，以檢視建置和部署的程式碼。保持標籤開啟。

1. 返回工作流程執行清單，並等待最近的執行完成。這麼做時，請返回您開啟的索引標籤，以檢視 Web 應用程式並重新整理瀏覽器。您應該會看到您在合併提取請求中所做的變更。

## 清除資源
<a name="source-getting-started-clean-up"></a>

探索使用來源儲存庫並提取請求後，建議您移除不需要的任何資源。您無法刪除提取請求，但可以關閉它們。您可以刪除您建立的任何分支。

如果您不再需要來源儲存庫或專案，您也可以刪除這些資源。如需詳細資訊，請參閱[刪除來源儲存庫](source-repositories-delete.md)及[刪除專案](projects-delete.md)。