diff --git a/src/pages/gen2/deploy-and-host/fullstack-branching/cross-account-deployments/index.mdx b/src/pages/gen2/deploy-and-host/fullstack-branching/cross-account-deployments/index.mdx
index 86ff0595e4c..daab51b13fa 100644
--- a/src/pages/gen2/deploy-and-host/fullstack-branching/cross-account-deployments/index.mdx
+++ b/src/pages/gen2/deploy-and-host/fullstack-branching/cross-account-deployments/index.mdx
@@ -1,7 +1,7 @@
export const meta = {
- title: 'Cross account deployments',
+ title: 'Cross-account deployments',
description:
- 'Setup a cross account deployment pipeline powered by Amazon CodeCatalyst and AWS Amplify Hosting.'
+ 'Set up a cross-account deployment pipeline powered by Amazon CodeCatalyst and AWS Amplify Hosting.'
};
export function getStaticProps(context) {
@@ -12,49 +12,49 @@ export function getStaticProps(context) {
};
}
-This guide walks you through how to create a trunk-based, multi-region deployment pipeline for your AWS Amplify Gen 2 applications. In this tutorial, we will be using Amazon CodeCatalyst and AWS Amplify Hosting, but you can choose any CI/CD provider.
+This guide walks you through how to create a trunk-based, multi-region deployment pipeline for applications built using AWS Amplify (Gen 2). We will be using Amazon CodeCatalyst and AWS Amplify Hosting in this guide, but you can choose any CI/CD provider.
-**Note**: You can deploy this custom pipeline either in us-west-2 or eu-west-1 region because Amazon CodeCatalyst is currently only available in these [AWS regions](https://docs.aws.amazon.com/general/latest/gr/codecatalyst.html).
+**Note**: You can deploy this custom pipeline either in the us-west-2 or eu-west-1 Regions, as Amazon CodeCatalyst is currently only available in those two [AWS Regions](https://docs.aws.amazon.com/general/latest/gr/codecatalyst.html).
-### Step 1: Setup an Amazon CodeCatalyst space
+### Step 1: Set up an Amazon CodeCatalyst space
-Please refer to this Amazon CodeCatalyst [guide](https://docs.aws.amazon.com/codecatalyst/latest/userguide/setting-up-topnode.html) for a detailed step-by-step walkthrough to setup your [space](https://docs.aws.amazon.com/codecatalyst/latest/userguide/spaces.html).
+Please refer to this Amazon CodeCatalyst [guide](https://docs.aws.amazon.com/codecatalyst/latest/userguide/setting-up-topnode.html) for a detailed step-by-step walkthrough to set up your [space](https://docs.aws.amazon.com/codecatalyst/latest/userguide/spaces.html).
-### Step 2: Deploy an Amplify Gen 2 app
+### Step 2: Deploy an app using Amplify (Gen 2)
-- Sign into the [AWS Management Console](https://console.aws.amazon.com/).
-- Navigate to the [Amplify Gen 2 app creation page](https://us-west-2.console.aws.amazon.com/amplify/create).
+- Sign in to the [AWS Management Console](https://console.aws.amazon.com/).
+- Navigate to the [app creation page](https://us-west-2.console.aws.amazon.com/amplify/create) for Amplify (Gen 2).
- Select the **Next.js-Amplify starter** app, then select **Next**.
-- Review the details on the **Create Git Repository** page, then select **Save and Deploy**.
-- Done! You have successfully deployed a Amplify Gen 2 app and you can review the status of the app deployment in the Amplify Gen 2 console.
+- Review the details on the **Create Git Repository** page, then select **Save and deploy**.
+- Done! You have successfully deployed a Gen-2 app. You can review the status of the app deployment in the Amplify (Gen 2) console.
-![](images/gen2/cross-account-deployments/pipeline1.png)
+![Screenshot of completed deployment in AWS Amplify (Gen 2) console](images/gen2/cross-account-deployments/pipeline1.png)
### Step 3: Update build specification
-Add the `npx amplify generate config --branch $AWS_BRANCH --app-id $AWS_APP_ID` command to the buildSpec and comment out the `npx amplify pipeline-deploy --branch $AWS_BRANCH --app-id $AWS_APP_ID` command. `amplify pipeline-deploy` runs a script to deploy backend updates, while `amplify generate config` fetches the latest `amplifyconfiguration.json` for the specified environment.
+Add the `npx amplify generate config --branch $AWS_BRANCH --app-id $AWS_APP_ID` command to the build spec and comment out the `npx amplify pipeline-deploy --branch $AWS_BRANCH --app-id $AWS_APP_ID` command. `amplify pipeline-deploy` runs a script to deploy backend updates, while `amplify generate config` fetches the latest `amplifyconfiguration.json` for the specified environment.
-![](images/gen2/cross-account-deployments/pipeline10.png)
+![Screenshot of Build image settings section in AWS Amplify (Gen 2) console, with details about the app build specification](images/gen2/cross-account-deployments/pipeline10.png)
### Step 4: Disable automatic builds on the branch
-You can configure Amplify to disable automatic builds on every code commit. Navigate to the app in the Gen 2 console, under **App settings**, select **Repository settings**. From the **Branches** section, select the branch and then choose **Disable auto build** from the **Actions** dropdown menu.
+You can configure Amplify to disable automatic builds on every code commit. Navigate to the app in the Amplify (Gen 2) console. Under **App settings**, select **Repository settings**. From the **Branches** section, select the branch and then choose **Disable auto build** from the **Actions** dropdown menu.
-![](images/gen2/cross-account-deployments/pipeline9.png)
+![Screenshot of the Repository settings section in the Amplify (Gen 2) console, highlighting the selection of Disable auto build in the Actions dropdown menu](images/gen2/cross-account-deployments/pipeline9.png)
### Step 5: Create an incoming webhook
-You can setup an incoming webhook to trigger a build without committing code to your Git repository. Currently, the Amplify Gen 2 console does not support creation of incoming webhooks. That being said, you can create a webhook for a Gen 2 app using the AWS CLI by running the [`create-webhook`](https://awscli.amazonaws.com/v2/documentation/api/latest/reference/amplify/create-webhook.html) command:
+You can set up an incoming webhook to trigger a build without committing code to your Git repository. Currently, the Amplify (Gen 2) console does not support creation of incoming webhooks. However, you can create a webhook for a Gen-2 app using the AWS CLI by running the [`create-webhook`](https://awscli.amazonaws.com/v2/documentation/api/latest/reference/amplify/create-webhook.html) command:
```bash
aws amplify create-webhook --app-id --branch-name --region
```
-Upon successfully execution of this command, you should observe a response similar to this:
+After running this command successfully, you should see a response similar to the following:
```
{
@@ -69,7 +69,7 @@ Upon successfully execution of this command, you should observe a response simil
}
```
-Next, you will need to construct a `curl` command utilizing the `webhookId` to trigger a build:
+Next, you will need to construct a `curl` command that uses the `webhookId` to trigger a build:
```
curl -X POST -d {} "`webhookUrl`&operation=startbuild" -H "Content-Type:application/json"
@@ -81,42 +81,42 @@ Please refer to this Amazon CodeCatalyst [guide](https://docs.aws.amazon.com/cod
-**Note**: When creating your project, select the **amplify-nextjs-starter-app** GitHub repository which was used to deploy the Amplify Gen 2 app as stated in Step 2.
+**Note**: When creating your project, select the **amplify-nextjs-starter-app** GitHub repository, which we used to deploy the Gen-2 app in Step 2.
-![](images/gen2/cross-account-deployments/pipeline2.png)
+![Screenshot of CodeCatalyst console showing Source repositories section](images/gen2/cross-account-deployments/pipeline2.png)
-### Step 7: Setup the resources in a different or target AWS account
+### Step 7: Set up the resources in a different or target AWS account
-You will need to implement steps 1 through 6 that are outlined in this guide above in a different AWS account (for example: `production` account) to achieve the cross account deployment strategy.
+To achieve a cross-account deployment, you will need to implement Steps 1 through 6 outlined previously in this guide in a different AWS account (for example, `production` account).
### Step 8: Add the target AWS account to the CodeCatalyst space
-Navigate to the CodeCatalyst space created as part of Step 1, select **Settings** and then select **AWS accounts**. Add the target **AWS account ID** (Step 7) to it and select **Associate AWS account**.
+Navigate to the CodeCatalyst space created as part of Step 1, select **Settings**, and then select **AWS accounts**. Add the target **AWS account ID** (Step 7) to it and select **Associate AWS account**.
-![](images/gen2/cross-account-deployments/pipeline12.png)
+![Screenshot of CodeCatalyst console showing details of the Associate AWS account section](images/gen2/cross-account-deployments/pipeline12.png)
-You will also need to create an IAM role in the target AWS account which will be assumed by the `staging` environment to perform actions and deploy resources in the `production` environment. As a best practice, we would recommend attaching the [`AmplifyBackendDeployFullAccess`](https://docs.aws.amazon.com/amplify/latest/userguide/security-iam-awsmanpol.html#security-iam-awsmanpol-AmplifyBackendDeployFullAccess) AWS managed policy to the IAM role as it contains all the required permissions to deploy Amplify Gen 2 based resources in your account. You can learn more about adding IAM roles to account connections in the CodeCatalyst [documentation](https://docs.aws.amazon.com/codecatalyst/latest/userguide/ipa-connect-account-addroles.html).
+You will also need to create an IAM role in the target AWS account which will be assumed by the `staging` environment to perform actions and deploy resources in the `production` environment. As a best practice, we recommend attaching the [`AmplifyBackendDeployFullAccess`](https://docs.aws.amazon.com/amplify/latest/userguide/security-iam-awsmanpol.html#security-iam-awsmanpol-AmplifyBackendDeployFullAccess) AWS managed policy to the IAM role as it contains all the required permissions to deploy Gen-2 resources in your account. You can learn more about adding IAM roles to account connections in the CodeCatalyst [documentation](https://docs.aws.amazon.com/codecatalyst/latest/userguide/ipa-connect-account-addroles.html).
### Step 9: Create a workflow in the Amazon CodeCatalyst project
-A workflow is an automated procedure that describes how to build, test, and deploy your code as part of a continuous integration and continuous delivery (CI/CD) system. You can learn more about workflows [here](https://docs.aws.amazon.com/codecatalyst/latest/userguide/flows.html).
+A workflow is an automated procedure that describes how to build, test, and deploy your code as part of a continuous integration and continuous delivery (CI/CD) system. You can learn more about workflows in the [Amazon CodeCatalyst User Guide](https://docs.aws.amazon.com/codecatalyst/latest/userguide/flows.html).
- Within the CodeCatalyst project, navigate to the **CI/CD** feature and select **Workflows**.
-- Select **Create Workflow**.
+- Select **Create workflow**.
- Choose the **amplify-nextjs-starter-app** GitHub repository and the branch **main** from the dropdown menu.
- Next, select **Create**.
-![](images/gen2/cross-account-deployments/pipeline3.png)
+![Screenshot of the CodeCatalyst console showing details of the Create workflow dialog box](images/gen2/cross-account-deployments/pipeline3.png)
Once you create the workflow, you should see a **yaml** editor in the CodeCatalyst console.
-![](images/gen2/cross-account-deployments/pipeline4.png)
+![Screenshot of yaml editor in CodeCatalyst console](images/gen2/cross-account-deployments/pipeline4.png)
Switch the experience in the console to the **Visual** editor. Select the **Actions** button to see a list of workflow actions that you can add to your workflow.
-![](images/gen2/cross-account-deployments/pipeline5.png)
+![Screenshot of CodeCatalyst console showing the Workflows section with +Actions highlighted](images/gen2/cross-account-deployments/pipeline5.png)
Add the **Build** action to the workflow and select the **Add variable** button in the **Inputs** section. Add the following environment variables to it:
@@ -124,11 +124,11 @@ Add the **Build** action to the workflow and select the **Add variable** button
- AWS_APP_ID_PRODUCTION: `amplify app id for production app`
- AWS_BRANCH: `git branch name`
-![](images/gen2/cross-account-deployments/pipeline13.png)
+![Screenshot of CodeCatalyst console showing the Workflows section, focusing on Inputs for the build](images/gen2/cross-account-deployments/pipeline13.png)
-Add another **Build** action to the workflow and select the **Depends on** button in the **Inputs** section. From the dropdown menu, select the name of the previous build action to setup the pipeline.
+Add another **Build** action to the workflow and select the **Depends on** button in the **Inputs** section. From the dropdown menu, select the name of the previous build action to set up the pipeline.
-![](images/gen2/cross-account-deployments/pipeline14.png)
+![Screenshot of CodeCatalyst console showing the Workflows section, focusing on the visual workflow and the Inputs section](images/gen2/cross-account-deployments/pipeline14.png)
Next, select the **Configuration** section and add the following information to each of the build actions:
@@ -136,7 +136,7 @@ Next, select the **Configuration** section and add the following information to
- AWS account connection: `your account connection`
- Role: `role setup with your account connection`
-![](images/gen2/cross-account-deployments/pipeline8.png)
+![Screenshot of CodeCatalyst console showing the Workflows section, focusing on the Configuration section](images/gen2/cross-account-deployments/pipeline8.png)
You will then need to add the following shell commands to each of the build actions:
@@ -158,12 +158,12 @@ You can now run **Validate** to ensure your workflow definition `yaml` file is v
-**Note**: Since workflows are saved with commits, and because the workflow has a code push trigger configured, saving the workflow starts a workflow run automatically.
+**Note**: Since workflows are saved as commits, and this workflow has a code push trigger enabled, committing the workflow will automatically start a new workflow run.
Next, you can review the result of the workflow run from the **Runs** tab:
-![](images/gen2/cross-account-deployments/pipeline11.png)
+![Screenshot of CodeCatalyst console showing the Workflows section, focusing on the Runs tab](images/gen2/cross-account-deployments/pipeline11.png)
-Done! You have successfully setup a custom cross account pipeline to deploy your frontend and backend for Amplify Gen 2 apps. To summarize, this custom pipeline will enable you to deploy your backend initially with your `staging` environment using `amplify pipeline-deploy` in the CodeCatalyst workflow and `amplify generate config` will generate the `amplifyconfiguration.json` file for the `main` branch and Amplify Hosting will not deploy backend resources as part of the build and instead will use the deployed backend resources from the `main` branch. Once the staging environment deploys successfully, a similar process will be followed to deploy your `production` environment in a different AWS account.
+Done! You have successfully set up a custom cross-account pipeline to deploy your frontend and backend for apps built using Amplify (Gen 2). To summarize, this custom pipeline will enable you to deploy your backend initially with your `staging` environment using `amplify pipeline-deploy` in the CodeCatalyst workflow and `amplify generate config` will generate the `amplifyconfiguration.json` file for the `main` branch. Amplify Hosting will not deploy backend resources as part of the build and instead will use the deployed backend resources from the `main` branch. Once the staging environment deploys successfully, a similar process will be followed to deploy your `production` environment in a different AWS account.
diff --git a/src/pages/gen2/deploy-and-host/fullstack-branching/mono-and-multi-repos/index.mdx b/src/pages/gen2/deploy-and-host/fullstack-branching/mono-and-multi-repos/index.mdx
index 985fe46db66..0da986d0506 100644
--- a/src/pages/gen2/deploy-and-host/fullstack-branching/mono-and-multi-repos/index.mdx
+++ b/src/pages/gen2/deploy-and-host/fullstack-branching/mono-and-multi-repos/index.mdx
@@ -13,23 +13,23 @@ export function getStaticProps(context) {
}
-You might have a different frontend and backend team that maintains their own repositories. Amplify (Gen 2) now offers the ability of deploying repositories that have backend-only code. So frontend and backend teams can operate independently of each other.
+You might have different frontend and backend teams that maintain their own repositories. With Amplify (Gen 2), you can deploy repositories that have backend-only code, so frontend and backend teams can operate independently of each other.
## Deploy the backend app
1. Run `mkdir backend-app && npm create amplify@latest` to set up a backend-only Amplify project. Commit the code to a Git provider of your choice.
-1. Connect the `backend-app` in the new console. Navigate to the Amplify console and select _New app > Build an app (Gen 2)_.
+1. Connect the `backend-app` in the new console. Navigate to the Amplify console and select **New app > Build an app (Gen 2)**.
1. When you connect the repository, notice the only auto-detected framework is Amplify.
-![multirepo](/images/gen2/fullstack-branching/multirepo1.png)
+![Screenshot of the App Settings section in the Amplify console with Amplify Deploy listed under Auto-detected frameworks](/images/gen2/fullstack-branching/multirepo1.png)
-4. Once you hit _Save and deploy_, your backend project will build.
+4. Once you choose **Save and deploy**, your backend project will build.
## Deploy the frontend app
-1. Now lets set up the frontend app and connect to the deployed backend.
+1. Now let's set up the frontend app and connect to the deployed backend.
```
npm create next-app@14 -- multi-repo-example --typescript --eslint --no-app --no-src-dir --no-tailwind --import-alias '@/*'
@@ -43,7 +43,7 @@ cd multi-repo-example
npm add @aws-amplify/backend-cli aws-amplify @aws-amplify/ui-react
```
-3. To connect to the deployed backend run the following command. The `app-id` to reference is the `APPID` for your backend app. You can find this by going to the Amplify console and navigating to _backend-app > App settings > App ARN_ and copying the ID located at the end of the string `arn:aws:amplify:::apps/app-id`.
+3. To connect to the deployed backend, run the following command. The `app-id` to reference is the `APPID` for your backend app. You can find this by going to the Amplify console and navigating to **backend-app > App settings > General settings > App ARN** and copying the ID located at the end of the string `arn:aws:amplify:::apps/app-id`.
```
npx amplify generate config --branch main --app-id BACKEND-APPID
@@ -53,7 +53,7 @@ This will generate the `amplifyconfiguration.json` file that contains all the in
@@ -106,15 +106,15 @@ frontend:
- node_modules/**/*
```
-4. Now let's deploy the app in the Amplify Console, choose _New app > Build an app (Gen 2)_. Connect the repository and leave the default settings. You should see the build generates the config and does not deploy a frontend. Validate that your app is working fine.
+4. Now let's deploy the app. In the Amplify console, choose **New app > Build an app (Gen 2)**. Connect the repository and leave the default settings. You should see the build generates the config and does not deploy a frontend. Validate that your app is working fine.
-![multi-repo](/images/gen2/fullstack-branching/multirepo4.png)
+![Screenshot of the Deployments page in the Amplify console showing the build of the app](/images/gen2/fullstack-branching/multirepo4.png)
## Trigger a frontend build on backend updates
-What you ideally want is for the frontend to pick up the latest backend updates every time there is a modification.
+The ideal scenario is that the frontend automatically retrieves the latest updates from the backend every time there is a modification made to the backend code.
-1. Use the AWS CLI to create an [incoming webhook](https://docs.aws.amazon.com/amplify/latest/userguide/webhooks.html). If the command executes successfully, you should see a response printed out like below:
+1. Use the AWS CLI to create an [incoming webhook](https://docs.aws.amazon.com/amplify/latest/userguide/webhooks.html). If the command runs successfully, you should see a response printed out like below:
```
aws amplify create-webhook --app-id FRONTEND-APPID --branch-name main --region REGION