title | description | ms.date | ms.topic |
---|---|---|---|
Connect an ASP.NET Core app to SQL Server using .NET Aspire and Entity Framework Core |
Learn how to connect an ASP.NET Core app to to SQL Server using .NET Aspire and Entity Framework Core. |
05/14/2024 |
tutorial |
In this tutorial, you create an ASP.NET Core app that uses a .NET Aspire Entity Framework Core SQL Server component to connect to SQL Server to read and write support ticket data. Entity Framework Core is a lightweight, extensible, open source object-relational mapper that enables .NET developers to work with databases using .NET objects. You'll learn how to:
[!div class="checklist"]
- Create a basic .NET app that is set up to use .NET Aspire components
- Add a .NET Aspire component to connect to SQL Server
- Configure and use .NET Aspire Component features to read and write from the database
[!INCLUDE aspire-prereqs]
- At the top of Visual Studio, navigate to File > New > Project.
- In the dialog window, search for Blazor and select Blazor Web App. Choose Next.
- On the Configure your new project screen:
- Enter a Project Name of AspireSQLEFCore.
- Leave the rest of the values at their defaults and select Next.
- On the Additional information screen:
- Make sure .NET 8.0 is selected.
- Ensure the Interactive render mode is set to None.
- Check the Enlist in .NET Aspire orchestration option and select Create.
Visual Studio creates a new ASP.NET Core solution that is structured to use .NET Aspire. The solution consists of the following projects:
- AspireSQLEFCore: A Blazor project that depends on service defaults.
- AspireSQLEFCore.AppHost: An orchestrator project designed to connect and configure the different projects and services of your app. The orchestrator should be set as the startup project.
- AspireSQLEFCore.ServiceDefaults: A shared class library to hold configurations that can be reused across the projects in your solution.
To represent a user submitted support request, add the following SupportTicket
model class at the root of the AspireSQLEFCore project.
:::code source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore/SupportTicket.cs":::
Add the following TicketDbContext
data context class at the root of the AspireSQLEFCore project. The class inherits xref:System.Data.Entity.DbContext?displayProperty=fullName to work with Entity Framework and represent your database.
:::code source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore/TicketContext.cs":::
Add the .NET Aspire Entity Framework Core Sql Server library package to your AspireSQLEFCore project:
dotnet add package Aspire.Microsoft.EntityFrameworkCore.SqlServer
Your AspireSQLEFCore project is now set up to use .NET Aspire components. Here's the updated AspireSQLEFCore.csproj file:
:::code language="csharp" source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore/AspireSQLEFCore.csproj" highlight="10, 11":::
In the :::no-loc text="Program.cs"::: file of the AspireSQLEFCore project, add a call to the xref:Microsoft.Extensions.Hosting.AspireSqlServerEFCoreSqlClientExtensions.AddSqlServerDbContext%2A extension method after the creation of the builder
but before the call to AddServiceDefaults
. For more information, see .NET Aspire service defaults. Provide the name of your connection string as a parameter.
:::code language="csharp" source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore/Program.cs" range="1-14" highlight="5":::
This method accomplishes the following tasks:
- Registers a
TicketDbContext
with the DI container for connecting to the containerized Azure SQL Database. - Automatically enable corresponding health checks, logging, and telemetry.
While developing locally, you need to create a database inside the SQL Server container. Update the :::no-loc text="Program.cs"::: file with the following code to automatically run Entity Framework migrations during startup.
:::code language="csharp" source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore/Program.cs" range="1-30" highlight="16-30":::
The app requires a form for the user to be able to submit support ticket information and save the entry to the database.
Use the following Razor markup to create a basic form, replacing the contents of the Home.razor file in the AspireSQLEFCore/Components/Pages directory:
:::code language="razor" source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore/Components/Pages/Home.razor":::
For more information about creating forms in Blazor, see ASP.NET Core Blazor forms overview.
The AspireSQLEFCore.AppHost project is the orchestrator for your app. It's responsible for connecting and configuring the different projects and services of your app. The orchestrator should be set as the startup project.
Add the .NET Aspire Hosting Sql Server NuGet package to your AspireStorage.AppHost project:
dotnet add package Aspire.Hosting.SqlServer
Replace the contents of the :::no-loc text="Program.cs"::: file in the AspireSQLEFCore.AppHost project with the following code:
:::code language="csharp" source="snippets/tutorial/AspireSQLEFCore/AspireSQLEFCore.AppHost/Program.cs":::
The preceding code adds a SQL Server Container resource to your app and configures a connection to a database called sqldata
. The Entity Framework classes you configured earlier will automatically use this connection when migrating and connecting to the database.
The sample app is now ready for testing. Verify that the submitted form data is persisted to the database by completing the following steps:
-
Select the run button at the top of Visual Studio (or F5) to launch your .NET Aspire app dashboard in the browser.
-
On the projects page, in the AspireSQLEFCore row, click the link in the Endpoints column to open the UI of your app.
:::image type="content" source="media/app-home-screen.png" lightbox="media/app-home-screen.png" alt-text="A screenshot showing the home page of the .NET Aspire support application.":::
-
Enter sample data into the
Title
andDescription
form fields. -
Select the Submit button, and the form submits the support ticket for processing — (then select Clear to clear the form).
-
The data you submitted displays in the table at the bottom of the page when the page reloads.