title | description | ms.service | ms.topic | ms.author | author | ms.date | zone_pivot_groups |
---|---|---|---|---|---|---|---|
Deploy a starter app with App Spaces |
Learn how to deploy a starter app to create a web application with App Spaces. |
app-spaces |
quickstart |
msangapu |
msangapu-msft |
05/20/2024 |
app-spaces-frontend-backend |
[!include preview note]
App Spaces is an intelligent service for developers that reduces the complexity of creating and managing web apps. This article describes how to deploy a starter app to App Spaces. You select one of the samples provided to provision new resources on Azure. For more information, see About App Spaces.
To deploy a sample app for App Spaces, you must have the following items:
- Azure account and subscription. You can only deploy with a subscription that you own.
- GitHub account
While Express.JS (back end) and React (front end) apps are used in this quickstart, other starter apps are also available in App Spaces. See App Spaces in the Azure portal for a full list of starter apps in App Spaces.
Follow these steps to deploy a starter app to App Spaces.
- Browse to the Azure portal.
- In the search bar, search for app spaces and select it in the results. :::image type="content" source="media/azure-portal-search-app-spaces.png" alt-text="Screenshot of App Space in Azure portal.":::
- In the App Spaces page, select + Create App Space.
::: zone pivot="frontend"
4. Under Use a starter app, select React App.
-
Enter the following values in the Connect to GitHub section.
Setting Action GitHub account Select your GitHub account. Organization Select your organization. New repository Enter myReactSample
for your new repository.
-
Enter the following values in the Configure app details section.
Setting Action App Space name Enter myAppSpace
.Subscription Select your subscription. Region Select your region. -
Select Deploy button at the bottom of the Deploy App Space page.
The sample web application code deploys to App Spaces. The deployment can take a few minutes to complete.
[!include deployment note]
::: zone-end
::: zone pivot="backend"
4. Under Use a starter app, select Express.JS App.
-
Enter the following values in the Connect to GitHub section.
Setting Action GitHub account Select your GitHub account. Organization Select your organization. New repository Enter myExpressSample
for your new repository.
-
Enter the following values in the Configure app details section.
Setting Action App Space name Enter myAppSpace
.Subscription Select your subscription. Region Select your region. -
Select Deploy button at the bottom of the Deploy App Space page.
The sample web application code deploys to App Spaces. The deployment can take a few minutes to complete.
[!include deployment note] ::: zone-end
In your App Space Page, select Open app in browser to view your new app.
::: zone pivot="frontend"
:::image type="content" source="media/verify-deployment-react.png" alt-text="Screenshot of React app running.":::
::: zone-end
::: zone pivot="backend"
:::image type="content" source="media/verify-deployment-express.png" alt-text="Screenshot Express.JS app running.":::
::: zone-end
[!include deployment note]
For more information about managing App Spaces, see Manage components.