DotNetNote – MVC·Razor·Blazor 통합 프로젝트 실행하기
이 문서는 Visual Studio 2026과 .NET 10.0 환경에서 MVC, Razor Pages, Blazor Server를 하나의 프로젝트로 통합하여 실행하는 방법을 단계별로 안내합니다.
프로젝트 이름은 DotNetNote이며, /Index, /Home/Index, /Dashboard 경로를 통해 각각 Razor Pages, MVC, Blazor Server 페이지에 접근할 수 있도록 구성합니다.
또한 기본 IdentityUser를 ApplicationUser로 변경하고, EF Core 마이그레이션을 다시 수행하여 데이터 구성을 정리하는 과정을 포함합니다.
1. 프로젝트 기본 구조 생성
먼저 Visual Studio 2026을 실행한 뒤 새 솔루션을 생성합니다.
솔루션 이름은 DotNetNote로 하고 위치는 C:\DotNetNote\src로 지정합니다.
다음 세 가지 프로젝트를 추가합니다.
- DotNetNote: ASP.NET Core Web App (MVC)
- DotNetNote.Models: Class Library
- DotNetNote.SqlServer: SQL Server Database Project
위와 같이 구성하면 솔루션 구조는 아래와 같습니다.
DotNetNote.slnx
├─ DotNetNote (MVC)
├─ DotNetNote.Models (Class Library)
└─ DotNetNote.SqlServer (Database Project)
2. MVC 프로젝트 구성 및 실행
MVC 템플릿을 기반으로 DotNetNote 프로젝트를 생성하고 대상 프레임워크는 .NET 10.0을 선택합니다.
기본 정적 파일 이름을 다음과 같이 변경합니다.
site.css → site.mvc.css
site.js → site.mvc.js
Views/Shared/_Layout.cshtml 파일에서 다음과 같이 참조를 교체합니다.
<link rel="stylesheet" href="~/css/site.mvc.css" />
<script src="~/js/site.mvc.js"></script>
이후 애플리케이션을 실행하여 /Home/Index 경로에서 기본 MVC 페이지가 정상적으로 표시되는지 확인합니다. 정상적으로 표시되면 MVC 구성은 완료입니다.
3. IdentityUser를 ApplicationUser로 리팩터링
인증 모델 확장을 위해 기본 IdentityUser를 ApplicationUser로 변경합니다.
Data 폴더에 ApplicationUser.cs 파일을 추가하고 다음 내용을 작성합니다.
동영상 강의에서는 ApplicationUser를 IdentityUser로 먼저 변경했다가 다시 IdentityUser를 ApplicationUser로 변경했습니다.
using Microsoft.AspNetCore.Identity;
namespace DotNetNote.Data
{
public class ApplicationUser : IdentityUser
{
}
}
ApplicationDbContext.cs 파일을 아래와 같이 수정하여 제네릭 형식 매개변수로 변경합니다.
using Microsoft.AspNetCore.Identity.EntityFrameworkCore;
using Microsoft.EntityFrameworkCore;
namespace DotNetNote.Data
{
public class ApplicationDbContext(DbContextOptions<ApplicationDbContext> options)
: IdentityDbContext<ApplicationUser>(options)
{
}
}
이제 EF Core 마이그레이션을 재생성합니다. 패키지 관리자 콘솔(PM>)에서 다음 명령을 순서대로 실행합니다.
Visual Studio에서 Data 폴더의 Migrations 폴더를 삭제 후 다음 명령을 진행합니다.
PM> Add-Migration InitialCreate -OutputDir Data/Migrations
PM> Update-Database
좀 더 자세한 명령은 다음과 같습니다.
PM> Drop-Database -Force -Confirm:$false
PM> Remove-Migration
PM> Add-Migration InitialCreate -OutputDir Data/Migrations
PM> Update-Database
명령이 완료되면 Data\Migrations 폴더 아래에 새 마이그레이션 파일이 생성됩니다.
처음 프로젝트 만들때 기본 생성되는 Migrations을 그대로 사용해도 무관합니다.
4. Razor Pages 프로젝트 병합
Razor Pages 기능을 MVC 프로젝트에 통합합니다.
임시로 Razor Pages 프로젝트(DotNetNote)를 생성한 후, 아래 주요 파일을 MVC 프로젝트(DotNetNote)로 복사합니다.
/Pages/ 폴더의 모든 내용들
/Pages/Index.cshtml
/Pages/Error.cshtml
/Pages/Shared/_Layout.cshtml
Program.cs 파일에 Razor Pages 등록 코드가 포함되어 있는지 확인합니다.
builder.Services.AddRazorPages();
app.MapRazorPages()
.WithStaticAssets();
애플리케이션 실행 후 /Index 경로에서 Razor Pages가 정상적으로 표시되는지 확인합니다. 정상적으로 표시되면 Razor Pages 통합이 완료입니다.
5. Blazor Server 프로젝트 통합
Blazor Server 기능을 추가하기 위해 "Blazor Web App (Server, Global)" 템플릿으로 프로젝트를 생성합니다.
프로젝트 이름은 DotNetNote로 지정합니다.
아래 주요 파일과 폴더를 MVC 프로젝트의 /Components 폴더로 복사합니다.
/Components/ 폴더의 모든 내용들
App.razor
Routes.razor
Layout/
Account/
복사한 파일의 네임스페이스는 DotNetNote로 통일합니다.
Program.cs 파일에 Blazor 관련 서비스를 등록합니다.
builder.Services.AddRazorComponents()
.AddInteractiveServerComponents();
app.MapRazorComponents<App>()
.AddInteractiveServerRenderMode();
그리고 Components/Pages/Home.razor 파일을 아래와 같이 수정합니다.
@page "/Dashboard"
<PageTitle>Home</PageTitle>
<h1>Hello, world!</h1>
Welcome to your new app.
실행 후 /Dashboard 경로에서 Blazor 페이지가 정상적으로 표시되는지 확인합니다. 정상적으로 표시되면 Blazor 통합이 완료입니다.
6. 최종 Program.cs 구성
최종적으로 DotNetNote의 Program.cs 파일은 아래와 같이 구성합니다. .NET 템플릿마다 조금씩 다를 수 있습니다.
using DotNetNote.Components;
using DotNetNote.Components.Account;
using DotNetNote.Data;
using Microsoft.AspNetCore.Components.Authorization;
using Microsoft.AspNetCore.Identity;
using Microsoft.EntityFrameworkCore;
var builder = WebApplication.CreateBuilder(args);
var connectionString = builder.Configuration.GetConnectionString("DefaultConnection")
?? throw new InvalidOperationException("Connection string 'DefaultConnection' not found.");
builder.Services.AddDbContext<ApplicationDbContext>(options => options.UseSqlServer(connectionString));
builder.Services.AddDatabaseDeveloperPageExceptionFilter();
builder.Services.AddDefaultIdentity<ApplicationUser>(options => options.SignIn.RequireConfirmedAccount = true)
.AddEntityFrameworkStores<ApplicationDbContext>();
builder.Services.AddControllersWithViews();
builder.Services.AddRazorPages();
builder.Services.AddRazorComponents().AddInteractiveServerComponents();
builder.Services.AddCascadingAuthenticationState();
builder.Services.AddScoped<IdentityRedirectManager>();
builder.Services.AddScoped<AuthenticationStateProvider, IdentityRevalidatingAuthenticationStateProvider>();
builder.Services.AddIdentityCore<ApplicationUser>(options =>
{
options.SignIn.RequireConfirmedAccount = true;
options.Stores.SchemaVersion = IdentitySchemaVersions.Version3;
})
.AddEntityFrameworkStores<ApplicationDbContext>()
.AddSignInManager()
.AddDefaultTokenProviders();
builder.Services.AddSingleton<IEmailSender<ApplicationUser>, IdentityNoOpEmailSender>();
var app = builder.Build();
if (app.Environment.IsDevelopment())
{
app.UseMigrationsEndPoint();
}
else
{
app.UseExceptionHandler("/Home/Error");
app.UseHsts();
}
app.UseHttpsRedirection();
app.UseRouting();
app.UseAuthorization();
app.UseAntiforgery();
app.MapStaticAssets();
app.MapControllerRoute(
name: "default",
pattern: "{controller=Home}/{action=Index}/{id?}")
.WithStaticAssets();
app.MapRazorPages().WithStaticAssets();
app.MapRazorComponents<App>().AddInteractiveServerRenderMode();
app.MapAdditionalIdentityEndpoints();
app.Run();
7. 실행 및 결과 확인
세 가지 웹 프레임워크를 통합한 상태에서 애플리케이션을 실행합니다. 아래 경로별 페이지가 정상적으로 표시되는지 확인합니다.
| 경로 | 프레임워크 | 설명 |
|---|---|---|
/Home/Index |
MVC | HomeController를 통해 렌더링합니다. |
/Index |
Razor Pages | Pages/Index.cshtml 페이지를 렌더링합니다. |
/Dashboard |
Blazor Server | Components/Pages/Home.razor 컴포넌트를 렌더링합니다. |
모든 경로가 정상적으로 표시되면 .NET 10.0 기반 통합 MVC·Razor·Blazor 프로젝트 구성이 완료입니다.
8. 최종 솔루션 구조
DotNetNote.slnx
├─ DotNetNote (MVC + Razor + Blazor 통합)
│ ├─ Controllers/
│ ├─ Data/
│ ├─ Components/
│ ├─ Pages/
│ ├─ Views/
│ └─ wwwroot/
├─ DotNetNote.Models
└─ DotNetNote.SqlServer
9. 마무리
이 문서에서 다룬 과정을 통해 하나의 ASP.NET Core MVC 프로젝트 내에서 Razor Pages와 Blazor Server를 함께 구성할 수 있습니다.