You signed in with another tab or window. Reload to refresh your session.You signed out in another tab or window. Reload to refresh your session.You switched accounts on another tab or window. Reload to refresh your session.Dismiss alert
You can connect to Azure Fluid Relay service by providing the tenant ID and key that is uniquely generated for you when creating the Azure resource. You can build your own token provider implementation or you can use the two token provider implementations that the Fluid Framework provides: **InsecureTokenProvider** and **AzureFunctionTokenProvider**.
31
30
32
-
To learn more about using InsecureTokenProvider for local development, see [Connecting to the service](connect-fluid-azure-service.md#connecting-to-the-service) and [Using InsecureTokenProvider for development](azure-function-token-provider.md#using-insecuretokenprovider-for-development).
31
+
To learn more about using InsecureTokenProvider for local development, see [Connecting to the service](connect-fluid-azure-service.md#connecting-to-the-service) and [Authentication and authorization in your app](../concepts/authentication-authorization.md#the-token-provider).
33
32
34
33
### Using AzureFunctionTokenProvider
35
34
@@ -61,7 +60,7 @@ Azure Static Web Apps allow you to develop a full-stack web site without needing
61
60
For more information about deploying Azure Function-powered APIs to your static web app see [Add an API to Azure Static Web Apps with Azure Functions](../../static-web-apps/add-api.md).
62
61
63
62
> [!NOTE]
64
-
> You can use the example Azure Function code in [Implementing an Azure Function to sign tokens](azure-function-token-provider.md#implementing-an-azure-function-to-sign-tokens) to implement your function.
63
+
> You can use the example Azure Function code in [Implementing an Azure Function to sign tokens](azure-function-token-provider.md#implement-an-azure-function-to-sign-tokens) to implement your function.
65
64
66
65
Once your Azure Function is deployed, you must update the URL passed to the AzureFunctionTokenProvider.
67
66
@@ -90,14 +89,14 @@ Run the `npm run build` command from the root directory to rebuild the app. This
90
89
91
90
1. Inside Visual Studio Code, select the Azure logo in the Activity Bar to open the Azure extensions window.
:::image type="content" source="../../static-web-apps/media/getting-started/extension-azure-logo.png" alt-text="An image of the Azure Logo on a white background.":::
94
93
95
94
> [!NOTE]
96
95
> You must sign in to Azure and GitHub in Visual Studio Code to continue. If you are not already authenticated, the extension will prompt you to sign in to both services during the creation process.
97
96
98
-
1. Under the _Static Web Apps_ label, select the **plus sign**.
97
+
1. Under the *Static Web Apps* label, select the **plus sign**.
:::image type="content" source="../../static-web-apps/media/getting-started/extension-create-button.png" alt-text="An image of the Static Web Apps extension UI, highlighting the create button.":::
101
100
102
101
> [!NOTE]
103
102
> The Azure Static Web Apps Visual Studio Code extension streamlines the creating process by using a series of default values. If you want to have fine-grained control of the creation process, open the command palate and select **Azure Static Web Apps: Create Static Web App... (Advanced)**.
@@ -106,13 +105,13 @@ Run the `npm run build` command from the root directory to rebuild the app. This
106
105
107
106
Select your subscription and press <kbd>Enter</kbd>.
108
107
109
-
:::image type="content" source="../../static-web-apps/media/getting-started/extension-subscription.png" alt-text="Select an Azure Subscription":::
108
+
:::image type="content" source="../../static-web-apps/media/getting-started/extension-subscription.png" alt-text="An image of the Azure subscription selection UI, which shows a single subscription to be selected.":::
110
109
111
110
1. Next, name your application.
112
111
113
112
Type **my-first-static-web-app** and press <kbd>Enter</kbd>.
114
113
115
-
:::image type="content" source="../../static-web-apps/media/getting-started/extension-create-app.png" alt-text="Create Static Web App":::
114
+
:::image type="content" source="../../static-web-apps/media/getting-started/extension-create-app.png" alt-text="An image of the Static Web Apps extension UI, which shows a text box to enter the name of the application.":::
116
115
117
116
1. Select a region close to you.
118
117
@@ -128,17 +127,17 @@ Run the `npm run build` command from the root directory to rebuild the app. This
128
127
129
128
1. Once the app is created, a confirmation notification is shown in Visual Studio Code.
:::image type="content" source="../../static-web-apps/media/getting-started/extension-confirmation.png" alt-text="An image of the notification shown in Visual Studio Code when the app is created. The notification reads: Successfully created new static web app my-first-static-web-app. GitHub Actions is building and deploying your app, it will be available once the deployment completes.":::
132
131
133
132
As the deployment is in progress, the Visual Studio Code extension reports the build status to you.
134
133
135
-
:::image type="content" source="../../static-web-apps/media/getting-started/extension-waiting-for-deployment.png" alt-text="Waiting for deployment":::
134
+
:::image type="content" source="../../static-web-apps/media/getting-started/extension-waiting-for-deployment.png" alt-text="An image of the Static Web Apps extension UI, which shows a list of static web apps under each subscription. The highlighted static web app has a status of Waiting for Deployment displayed next to it.":::
136
135
137
136
Once the deployment is complete, you can navigate directly to your website.
138
137
139
138
1. To view the website in the browser, right-click on the project in the Static Web Apps extension, and select **Browse Site**.
:::image type="content" source="../../static-web-apps/media/getting-started/extension-browse-site.png" alt-text="An image of the menu that is shown when right-clicking on a static web app. The Browse Site option is highlighted.":::
142
141
143
142
1. The location of your application code, Azure Function, and build output is part of the `azure-static-web-apps-xxx-xxx-xxx.yml` workflow file located in the `/.github/workflows` directory. This file is automatically created when create the Static Web app. It defines a GitHub Action to build and deploy your Static Web app.
144
143
@@ -149,4 +148,4 @@ If you're not going to continue to use this application, you can delete the Azur
149
148
150
149
In the Visual Studio Code Explorer window, return to the _Static Web Apps_ section and right-click on **my-first-static-web-app** and select **Delete**.
:::image type="content" source="../../static-web-apps/media/getting-started/extension-delete.png" alt-text="An image of the menu that is shown when right-clicking on a static web app. The Delete option is highlighted.":::
0 commit comments