Skip to content

Commit 5c628af

Browse files
Merge pull request #216254 from chcomley/users/chcomley/new-branch-SWA-review-publish-pull-requests-10-27
Refresh SWA review-publish-pull-request.md
2 parents fedda34 + 4993110 commit 5c628af

File tree

1 file changed

+48
-54
lines changed

1 file changed

+48
-54
lines changed
Lines changed: 48 additions & 54 deletions
Original file line numberDiff line numberDiff line change
@@ -1,119 +1,113 @@
11
---
2-
title: Review pull requests in pre-production environments in Azure Static Web Apps
2+
title: Review pull requests in pre-production environments
33
description: Learn how to use pre-production environments to review pull requests changes in Azure Static Web Apps.
44
services: static-web-apps
55
author: sinedied
66
ms.service: static-web-apps
7+
ms.custom: engagement-fy23
78
ms.topic: conceptual
8-
ms.date: 05/08/2020
9+
ms.date: 10/27/2022
910
ms.author: yolasors
1011
---
1112

12-
# Review pull requests in pre-production environments in Azure Static Web Apps
13+
# Review pull requests in pre-production environments
1314

14-
This article demonstrates how to use pre-production environments to review changes to applications deployed with [Azure Static Web Apps](overview.md).
15+
This article shows you how to use pre-production environments to review changes to applications that are deployed with [Azure Static Web Apps](overview.md). A pre-production environment is a fully functional staged version of your application that includes changes not available in production.
1516

16-
A pre-production (staging) environment is a fully-functional staged version of your application that includes changes not available in production.
17+
Azure Static Web Apps generates a GitHub Actions workflow in the repo. When a pull request is created against a branch that the workflow watches, the pre-production environment gets built. The pre-production environment stages the app, so you can review the changes before you push them to production.
1718

18-
Azure Static Web Apps generates a GitHub Actions workflow in the repository. When a pull request is created against a branch that the workflow watches, the pre-production environment is built. The pre-production environment stages the app, enables you to perform reviews before pushing them to production.
19+
You can do the following tasks within pre-production environments:
1920

20-
Multiple pre-production environments can co-exist at the same time when using Azure Static Web Apps. Each time you create a pull request against the watched branch, a staged version with your changes is deployed to a distinct pre-production environment.
21-
22-
There are many benefits of using pre-production environments. For example, you can:
23-
24-
- Review visual changes between production and staging. For example, viewing updates to content and layout.
25-
- Demonstrate the changes to your team.
26-
- Compare different versions of your application.
27-
- Validate changes using acceptance tests.
28-
- Perform sanity checks before deploying to production.
21+
- Review visual changes between production and staging, like updates to content and layout
22+
- Demonstrate the changes to your team
23+
- Compare different versions of your application
24+
- Validate changes using acceptance tests
25+
- Perform sanity checks before you deploy to production
2926

3027
> [!NOTE]
31-
> Pull requests and pre-production environments are currently only supported in GitHub Actions deployments.
28+
> Pull requests and pre-production environments are only supported in GitHub Actions deployments.
3229
3330
## Prerequisites
3431

35-
- An existing GitHub repository configured with Azure Static Web Apps. See [Building your first static app](getting-started.md) if you don't have one.
32+
- An existing GitHub repo configured with Azure Static Web Apps. See [Building your first static app](getting-started.md) if you don't have one.
3633

3734
## Make a change
3835

39-
Begin by making a change in your repository. You can do it directly on GitHub as shown in the following steps.
36+
Make a change in your repo directly on GitHub, as shown in the following steps.
4037

41-
1. Go to your project's repository on GitHub, then select **Branch** to create a new branch.
38+
1. Go to your project's repo on GitHub, and then select **Branch**.
4239

4340
:::image type="content" source="./media/review-publish-pull-requests/create-branch.png" alt-text="Create new branch using GitHub interface":::
4441

45-
Type a branch name and select **Create branch**.
42+
1. Enter a branch name and select **Create branch**.
4643

47-
2. Go to your _app_ folder and change some text content. For example, you can change a title or paragraph. Once you found the file you want to edit, select **Edit** to make the change.
44+
1. Go to your _app_ folder and change some text content, like a title or paragraph. Select **Edit** to make the change in the file.
4845

4946
:::image type="content" source="./media/review-publish-pull-requests/edit-file.png" alt-text="Edit file button in GitHub interface":::
5047

51-
3. After you make the changes, select **Commit changes** to commit your changes to the branch.
48+
1. Select **Commit changes** when you're done.
5249

53-
:::image type="content" source="./media/review-publish-pull-requests/commit-changes.png" alt-text="Commit changes button in GitHub interface":::
50+
:::image type="content" source="./media/review-publish-pull-requests/commit-changes.png" alt-text="Screenshot showing the Commit changes button in the GitHub interface.":::
5451

5552
## Create a pull request
5653

57-
Next, create a pull request from this change.
54+
Create a pull request to publish your update.
5855

59-
1. Open the **Pull request** tab of your project on GitHub:
56+
1. Open the **Pull request** tab of your project on GitHub.
6057

61-
:::image type="content" source="./media/review-publish-pull-requests/tab.png" alt-text="Pull request tab in a GitHub repository":::
58+
:::image type="content" source="./media/review-publish-pull-requests/tab.png" alt-text="Screenshot showing the pull request tab in a GitHub repo.":::
6259

63-
2. Select **Compare & pull request** on your branch.
60+
1. Select **Compare & pull request**.
6461

65-
3. You can optionally fill in some details about your changes, then select **Create pull request**.
62+
1. Optionally, enter details about your changes, and then select **Create pull request**.
6663

67-
:::image type="content" source="./media/review-publish-pull-requests/open.png" alt-text="Pull request creation in GitHub":::
64+
:::image type="content" source="./media/review-publish-pull-requests/open.png" alt-text="Screenshot showing the pull request creation in GitHub.":::
6865

69-
You can assign reviewers and add comments to discuss your changes if needed.
66+
Assign reviewers and add comments to discuss your changes, if needed.
7067

71-
> [!NOTE]
72-
> You can make multiple changes by pushing new commits to your branch. The pull request is then automatically updated to reflect all changes.
68+
Multiple pre-production environments can co-exist at the same time when you use Azure Static Web Apps. Each time you create a pull request against the watched branch, a staged version with your changes deploys to a distinct pre-production environment.
7369

74-
## Review changes
70+
You can make multiple changes and push new commits to your branch. The pull request automatically updates to reflect all changes.
7571

76-
After the pull request is created, the [GitHub Actions](https://github.com/features/actions) deployment workflow runs and deploys your changes to a pre-production environment.
72+
## Review changes
7773

78-
Once the workflow has completed building and deploying your app, the GitHub bot adds a comment to your pull request which contains the URL of the pre-production environment. You can select this link to see your staged changes.
74+
The [GitHub Actions](https://github.com/features/actions) deployment workflow runs and deploys your pull request changes to a pre-production environment.
7975

80-
:::image type="content" source="./media/review-publish-pull-requests/bot-comment.png" alt-text="Pull request comment with the pre-production URL":::
76+
Once the workflow completes building and deploying your app, the GitHub bot adds a comment to your pull request, which contains the URL of the pre-production environment.
8177

82-
Select the generated URL to see the changes.
78+
1. Select the pre-production URL to see your staged changes.
8379

84-
If you take a closer look at the URL, you can see that it's composed like this: `https://<SUBDOMAIN-PULL_REQUEST_ID>.<AZURE_REGION>.azurestaticapps.net`.
80+
:::image type="content" source="./media/review-publish-pull-requests/bot-comment.png" alt-text="Screenshot of pull request comment with the pre-production URL.":::
8581

86-
For a given pull request, the URL remains the same even if you push new updates. In addition to the URL staying constant, the same pre-production environment is reused for the life of the pull request.
82+
The URL is composed like this: `https://<SUBDOMAIN-PULL_REQUEST_ID>.<AZURE_REGION>.azurestaticapps.net`. For a given pull request, the URL remains the same, even if you push new updates. The same pre-production environment also gets reused for the life of the pull request.
8783

88-
To automate the review process with end-to-end testing, the [Azure Static Web App Deploy GitHub Action](https://github.com/Azure/static-web-apps-deploy) has the `static_web_app_url` output variable.
89-
This URL can be referenced in the rest of your workflow to run your tests against the pre-production environment.
84+
To automate the review process with end-to-end testing, the [GitHub Action for deploying Azure Static Web Apps](https://github.com/Azure/static-web-apps-deploy) has the `static_web_app_url` output variable.
85+
You can reference this URL in the rest of your workflow to run your tests against the pre-production environment.
9086

9187
## Publish changes
9288

93-
Once changes are approved, you can publish your changes to production by merging the pull request.
89+
Merge the pull request to publish to production.
9490

95-
Select **Merge pull request**:
91+
1. Select **Merge pull request**.
9692

97-
:::image type="content" source="./media/review-publish-pull-requests/merge.png" alt-text="Merge pull request button in GitHub interface":::
93+
:::image type="content" source="./media/review-publish-pull-requests/merge.png" alt-text="Screenshot showing the Merge pull request button in GitHub interface.":::
9894

99-
Merging copies your changes to the tracked branch (the "production" branch). Then, the deployment workflow starts on the tracked branch and the changes are live after your application has been rebuilt.
95+
Your changes get copied to the tracked branch (the "production" branch). Then, the deployment workflow starts on the tracked branch and the changes go live after your application rebuilds.
10096

101-
To verify the changes in production, open your production URL to load the live version of the website.
97+
1. Open your production URL to load the live version of the website and verify.
10298

10399
## Limitations
104100

105-
- Staged versions of your application are currently accessible publicly by their URL, even if your GitHub repository is private.
101+
- Anyone can access the staged versions of your application via their URL, even if your GitHub repo is private.
106102

107103
> [!WARNING]
108-
> Be careful when publishing sensitive content to staged versions, as access to pre-production environments are not restricted.
109-
110-
- The number of pre-production environments available for each app deployed with Static Web Apps depends on the [hosting plan](plans.md) you are using. For example, with the Free tier you can have 3 pre-production environments in addition to the production environment.
111-
112-
- Pre-production environments are not geo-distributed.
104+
> Be careful with sensitive content, since anyone can access pre-production environments.
113105
114-
- Currently, only GitHub Actions deployments support pre-production environments.
106+
- The number of pre-production environments available for each app deployed with Static Web Apps depends your [hosting plan](plans.md). For example, with the [Free tier](https://azure.microsoft.com/pricing/details/devops/azure-devops-services/) you can have three pre-production environments along with the production environment.
107+
- Pre-production environments aren't geo-distributed.
108+
- Only GitHub Actions deployments support pre-production environments.
115109

116110
## Next steps
117111

118112
> [!div class="nextstepaction"]
119-
> [Branch preview environments](branch-environments.md)
113+
> [Create branch preview environments](branch-environments.md)

0 commit comments

Comments
 (0)