` element with the following code:
```html
.NET ๐ Azure
Example .NET app to Azure App Service.
```
-----
> [!TIP]
> With GitHub Copilot enabled in Visual Studio, try the following steps:
>
> 1. Type
Alt+
/.
> 1. Ask Copilot, "Change to a Bootstrap card that says .NET ๐ Azure."
Save your changes.
1. To redeploy to Azure, right-click the **MyFirstAzureWebApp** project in **Solution Explorer** and select **Publish**.
1. In the **Publish** summary page, select **Publish**.
When publishing completes, Visual Studio launches a browser to the URL of the web app.
### [.NET 10](#tab/net10)
You see the updated ASP.NET Core 10.0 web app displayed in the page.
:::image type="content" source="media/quickstart-dotnetcore/updated-azure-web-app-net.png" lightbox="media/quickstart-dotnetcore/updated-azure-web-app-net.png" border="true" alt-text="Screenshot of Visual Studio - Updated ASP.NET Core 10.0 web app in Azure.":::
### [.NET Framework 4.8](#tab/netframework48)
You see the updated ASP.NET Framework 4.8 web app displayed in the page.
:::image type="content" source="media/quickstart-dotnetcore/vs-updated-azure-web-app-net-48.png" lightbox="media/quickstart-dotnetcore/vs-updated-azure-web-app-net-48.png" border="true" alt-text="Screenshot of Visual Studio - Updated ASP.NET Framework 4.8 web app in Azure.":::
-----
:::zone-end
:::zone target="docs" pivot="development-environment-vscode"
1. In your workspace, find *Components/Pages/Home.razor* and replace everything with the following code:
```html
@page "/"
Home
.NET ๐ Azure
Example .NET app to Azure App Service.
```
> [!TIP]
> Try this approach with GitHub Copilot:
>
> 1. Select the content and select :::image type="icon" source="media/quickstart-dotnetcore/github-copilot-in-editor.png" border="false":::.
> 1. Select **Modify**.
> 1. Enter "*Change to a Bootstrap card that says .NET ๐ Azure.*"
Save your changes.
1. In Visual Studio Code, select **View** > **Command Palette** again.
1. Search for and select *Azure App Service: Deploy to Web App*.
1. Select the subscription and the web app you used earlier.
1. When prompted, select **Deploy**.
1. When publishing completes, select **Browse Website** in the notification.
You see the updated ASP.NET Core 10.0 web app displayed in the page.
:::image type="content" source="media/quickstart-dotnetcore/updated-azure-web-app-net.png" lightbox="media/quickstart-dotnetcore/updated-azure-web-app-net.png" border="true" alt-text="Screenshot of Visual Studio Code - Updated ASP.NET Core 10.0 web app in Azure.":::
:::zone-end
:::zone target="docs" pivot="development-environment-cli,development-environment-ps"
> [!TIP]
> To see how Visual Studio Code with GitHub Copilot helps improve your web development experience, see the Visual Studio Code steps.
:::zone-end
:::zone target="docs" pivot="development-environment-cli"
1. In the local directory, find *Components/Pages/Home.razor* and replace everything with the following code:
```html
@page "/"
Home
.NET ๐ Azure
Example .NET app to Azure App Service.
```
1. Save your changes, then redeploy the app using the `az webapp up` command again and replace `
` with either `linux` or `windows`.
```azurecli
az webapp up --os-type
```
This command uses values that are cached locally in the *.azure/config* file, including the app name, resource group, and App Service plan.
1. After deployment completes, switch back to the browser window that opened in the **Browse to the app** step, and refresh.
You see the updated ASP.NET Core 10.0 web app displayed in the page.
:::image type="content" source="media/quickstart-dotnetcore/updated-azure-web-app-net.png" lightbox="media/quickstart-dotnetcore/updated-azure-web-app-net.png" border="true" alt-text="Screenshot of the CLI - Updated ASP.NET Core 10.0 web app in Azure.":::
:::zone-end
:::zone target="docs" pivot="development-environment-ps"
1. In the local directory, open *Components/Pages/Home.razor* and replace everything with the following code:
```html
@page "/"
Home
.NET ๐ Azure
Example .NET app to Azure App Service.
```
1. From the application root folder, prepare your local *MyFirstAzureWebApp* application for deployment using the [dotnet publish](/dotnet/core/tools/dotnet-publish) command:
```dotnetcli
dotnet publish --configuration Release
```
1. Change to the release directory and create a zip file from the contents:
```powershell
cd bin\Release\net10.0\publish
Compress-Archive -Path * -DestinationPath deploy.zip -Force
```
1. Publish the zip file to the Azure app using the [Publish-AzWebApp](/powershell/module/az.websites/publish-azwebapp) command:
```azurepowershell
Publish-AzWebApp -ResourceGroupName myResourceGroup -Name -ArchivePath (Get-Item .\deploy.zip).FullName -Force
```
> [!NOTE]
> `-ArchivePath` needs the full path of the zip file.
1. After deployment completes, switch back to the browser window that opened in the **Browse to the app** step, and refresh.
You see the updated Blazor web app displayed in the page.
:::image type="content" source="media/quickstart-dotnetcore/updated-azure-web-app-net.png" lightbox="media/quickstart-dotnetcore/updated-azure-web-app-net.png" border="true" alt-text="Screenshot of the CLI - Updated ASP.NET Core 10.0 web app in Azure.":::
:::zone-end
:::zone target="docs" pivot="development-environment-azure-portal"
1. Browse to your GitHub fork of the sample code.
1. On your repo page, create a codespace by selecting **Code** > **Create codespace on main**.
### [.NET 10](#tab/net10)
:::image type="content" source="media/quickstart-dotnetcore/github-forked-dotnetcore-docs-hello-world-repo-create-codespace.png" alt-text="Screenshot showing how to create a codespace in the forked dotnetcore-docs-hello-world GitHub repo.":::
### [.NET Framework 4.8](#tab/netframework48)
:::image type="content" source="media/quickstart-dotnetcore/github-forked-app-service-web-dotnet-get-started-repo-create-codespace.png" alt-text="Screenshot showing how to create a codespace in the forked app-service-web-dotnet-get-started GitHub repo.":::
-----
1. In **Solution Explorer**, find the default page in your project and replace the content as follows:
### [.NET 10](#tab/net10)
In *Components/Pages/Home.razor*, replace everything with the following code. The changes are saved automatically.
```html
@page "/"
Home
.NET ๐ Azure
Example .NET app to Azure App Service.
```
### [.NET Framework 4.8](#tab/netframework48)
In *Views/Home/Index.cshtml*, replace the first `` element with the following code. The changes are saved automatically.
```html
.NET ๐ Azure
Example .NET app to Azure App Service.
```
-----
> [!TIP]
> Try this approach with GitHub Copilot:
>
> 1. Select all the content and select :::image type="icon" source="media/quickstart-dotnetcore/github-copilot-in-editor.png" border="false":::.
> 1. Ask Copilot, "Change to a Bootstrap card that says .NET ๐ Azure."
1. From the **Source Control** menu, enter a commit message such as `Modify homepage`. Then, select **Commit** and confirm staging the changes by selecting **Yes**.
### [.NET 10](#tab/net10)
:::image type="content" source="media/quickstart-dotnetcore/visual-studio-code-in-browser-commit-push-dotnetcore.png" alt-text="Screenshot of Visual Studio Code in the browser, Source Control panel with a commit message of 'We love Azure' and the Commit and Push button highlighted.":::
### [.NET Framework 4.8](#tab/netframework48)
:::image type="content" source="media/quickstart-dotnetcore/visual-studio-code-in-browser-commit-push-dotnet-framework.png" alt-text="Screenshot of Visual Studio Code in the browser, Source Control panel with a commit message of 'We love Azure' and the Commit and Push button highlighted.":::
-----
> [!TIP]
> Let GitHub Copilot create a commit message for you by selecting :::image type="icon" source="media/quickstart-dotnetcore/github-copilot-in-editor.png" border="false"::: in the message box.
1. Select **Sync changes 1**, then confirm by selecting **OK**.
1. It takes a few minutes for the deployment to run. To view the progress, navigate to `https://github.com/
/dotnetcore-docs-hello-world/actions`.
1. Return to the browser window that opened during the **Browse to the app** step, and refresh the page.
### [.NET 10](#tab/net10)
You see the updated ASP.NET Core 10.0 web app displayed in the page.
:::image type="content" source="media/quickstart-dotnetcore/updated-azure-web-app-net.png" lightbox="media/quickstart-dotnetcore/updated-azure-web-app-net.png" border="true" alt-text="Screenshot of the CLI - Updated ASP.NET Core 10.0 web app in Azure.":::
### [.NET Framework 4.8](#tab/netframework48)
You see the updated ASP.NET Framework 4.8 web app displayed in the page.
:::image type="content" source="media/quickstart-dotnet/updated-azure-webapp-net-48.png" lightbox="media/quickstart-dotnet/updated-azure-webapp-net-48.png" border="true" alt-text="Screenshot of the CLI - Updated ASP.NET Framework 4.8 web app in Azure.":::
-----
:::zone-end
## Manage the Azure app
To manage your web app, go to the [Azure portal](https://portal.azure.com), and search for and select **App Services**.
:::image type="content" source="media/quickstart-dotnetcore/app-services.png" alt-text="Screenshot of the Azure portal - Select App Services option." lightbox="media/quickstart-dotnetcore/app-services.png":::
On the **App Services** page, select the name of your web app.
:::image type="content" source="./media/quickstart-dotnetcore/select-app-service.png" alt-text="Screenshot of the Azure portal - App Services page with an example web app selected.":::
The **Overview** page for your web app contains options for basic management like browse, stop, start, restart, and delete. The left menu provides further pages for configuring your app.
:::image type="content" source="media/quickstart-dotnetcore/web-app-overview-page.png" alt-text="Screenshot of the Azure portal - App Service overview page." lightbox="media/quickstart-dotnetcore/web-app-overview-page.png":::
:::zone target="docs" pivot="development-environment-vs"
[!INCLUDE [Clean-up Portal web app resources](../../includes/clean-up-section-portal-web-app.md)]
:::zone-end
:::zone target="docs" pivot="development-environment-vscode"
[!INCLUDE [Clean-up Portal web app resources](../../includes/clean-up-section-portal-web-app.md)]
:::zone-end
:::zone target="docs" pivot="development-environment-cli"
In the preceding steps, you created Azure resources in a resource group. If you don't expect to need these resources in the future, delete the resource group by running the following command in the Cloud Shell:
```azurecli
az group delete
```
For your convenience, the [az webapp up](/cli/azure/webapp#az-webapp-up) command that you ran earlier in this project saves the resource group name as the default value whenever you run `az` commands from this project.
:::zone-end
:::zone target="docs" pivot="development-environment-ps"
[!INCLUDE [Clean-up PowerShell resources](../../includes/powershell-samples-clean-up.md)]
:::zone-end
:::zone target="docs" pivot="development-environment-azure-portal"
[!INCLUDE [Clean-up Portal web app resources](../../includes/clean-up-section-portal-web-app.md)]
:::zone-end
## Next steps
### [.NET 10](#tab/net10)
Advance to the next article to learn how to create a .NET Core app and connect it to a SQL Database:
> [!div class="nextstepaction"]
> [Tutorial: ASP.NET Core app with SQL database](tutorial-dotnetcore-sqldb-app.md)
> [!div class="nextstepaction"]
> [App Template: ASP.NET Core app with SQL database and App Insights deployed using CI/CD GitHub Actions](https://github.com/Azure-Samples/app-templates-dotnet-azuresql-appservice)
> [!div class="nextstepaction"]
> [Configure ASP.NET Core app](configure-language-dotnetcore.md)
### [.NET Framework 4.8](#tab/netframework48)
Advance to the next article to learn how to create a .NET Framework app and connect it to a SQL Database:
> [!div class="nextstepaction"]
> [Tutorial: ASP.NET app with SQL database](app-service-web-tutorial-dotnet-sqldatabase.md)
>
> [!div class="nextstepaction"]
> [Configure ASP.NET Framework app](configure-language-dotnet-framework.md)
> [!div class="nextstepaction"]
>ย [Secure with custom domain and certificate](tutorial-secure-domain-certificate.md)
-----
[app-service-pricing-tier]: https://azure.microsoft.com/pricing/details/app-service/?ref=microsoft.com&utm_source=microsoft.com&utm_medium=docs&utm_campaign=visualstudio