ASP.NET Core MVC에서 Conferences 영역 구현하기

  • 7 minutes to read

ASP.NET Core MVC 영역(Areas) 사용

대규모 컨퍼런스를 웹 애플리케이션으로 구축할 때, 주요 기능을 효율적으로 관리하려면 Areas를 활용하는 것이 좋습니다. 본 문서에서는 ASP.NET Core MVC의 Areas를 활용하여 Conferences 영역을 구성하고, 그 안에 Tickets, Agenda, Speakers, Workshops 등의 기능을 포함하는 방법을 설명합니다.


MVC 프로젝트 생성

1. VisualAcademy 또는 DotNetNote 또는 Hawaso 이름의 ASP.NET Core MVC 프로젝트 생성

먼저, VisualAcademy, DotNetNote, 또는 Hawaso라는 이름으로 ASP.NET Core MVC 프로젝트를 생성합니다. 이를 위해 dotnet CLI 또는 Visual Studio를 사용할 수 있습니다.

1.1. dotnet CLI를 사용하여 프로젝트 생성

명령 프롬프트 또는 터미널에서 다음 명령을 실행하여 새로운 ASP.NET Core MVC 프로젝트를 생성합니다.

dotnet new mvc -n VisualAcademy
cd VisualAcademy

또는:

dotnet new mvc -n DotNetNote
cd DotNetNote

또는:

dotnet new mvc -n Hawaso
cd Hawaso

이제 프로젝트 폴더로 이동한 후, 기본 코드를 실행해 봅니다.

dotnet run

위 명령을 실행하면, 기본 ASP.NET Core MVC 웹 애플리케이션이 실행됩니다. 웹 브라우저에서 http://localhost:5000 또는 http://localhost:5001을 열어 확인할 수 있습니다.

1.2. Visual Studio에서 프로젝트 생성

  1. Visual Studio를 실행합니다.
  2. 새 프로젝트 만들기를 선택합니다.
  3. ASP.NET Core 웹 애플리케이션 템플릿을 선택하고 다음을 클릭합니다.
  4. 프로젝트 이름VisualAcademy, DotNetNote 또는 Hawaso로 설정합니다.
  5. 위치(Location) 지정한 후 다음을 클릭합니다.
  6. ASP.NET Core 8.0 또는 9.0을 선택하고 **MVC(Model-View-Controller)**를 선택합니다.
  7. 생성(Create) 버튼을 클릭하여 프로젝트를 만듭니다.
  8. F5를 눌러 실행하거나, 상단의 실행(Run) 버튼을 클릭하여 프로젝트를 실행합니다.

이제 기본 MVC 프로젝트가 생성되었으며, 브라우저에서 http://localhost:5000을 통해 실행된 웹 애플리케이션을 확인할 수 있습니다.


2. 기본 MVC 프로젝트 실행 및 테스트

프로젝트가 제대로 생성되었는지 확인하기 위해 dotnet run을 사용하여 실행한 후, 브라우저에서 해당 페이지가 정상적으로 로드되는지 확인합니다.

dotnet run으로 실행

dotnet run

Visual Studio에서 실행

  1. F5를 눌러 디버그 모드에서 실행합니다.
  2. Ctrl + F5를 눌러 디버그 없이 실행합니다.

성공적으로 실행되면 브라우저에서 기본 홈 페이지를 확인할 수 있습니다.

이제 프로젝트가 정상적으로 생성되었으며, 이후 Conferences 영역을 추가하여 확장할 준비가 되었습니다.


프로젝트 구조

Areas를 사용하면 컨퍼런스 관련 기능을 별도의 모듈로 구성하여 유지보수성을 높일 수 있습니다.

폴더 구조

/Areas
  /Conferences
    /Controllers
      TicketsController.cs
      AgendaController.cs
      SpeakersController.cs
      WorkshopsController.cs
    /Models
      Ticket.cs
      Session.cs
      Speaker.cs
      Workshop.cs
    /Views
      /Tickets
        Index.cshtml
      /Agenda
        Index.cshtml
      /Speakers
        Index.cshtml
      /Workshops
        Index.cshtml

컨트롤러 구성

각 컨트롤러에서 [Area("Conferences")] 특성(어트리뷰트)을 사용하여 Conferences 영역임을 지정합니다.

TicketsController

using Microsoft.AspNetCore.Mvc;
using VisualAcademy.Areas.Conferences.Models;
using System.Collections.Generic;

namespace VisualAcademy.Areas.Conferences.Controllers
{
    [Area("Conferences")]
    public class TicketsController : Controller
    {
        public IActionResult Index()
        {
            var tickets = new List<Ticket>
            {
                new Ticket { Id = 1, Name = "Standard", Price = 100, Description = "General Admission" },
                new Ticket { Id = 2, Name = "VIP", Price = 200, Description = "VIP Access" }
            };
            return View(tickets);
        }
    }
}

AgendaController

using Microsoft.AspNetCore.Mvc;
using VisualAcademy.Areas.Conferences.Models;
using System.Collections.Generic;

namespace VisualAcademy.Areas.Conferences.Controllers
{
    [Area("Conferences")]
    public class AgendaController : Controller
    {
        public IActionResult Index()
        {
            var sessions = new List<Session>
            {
                new Session { Id = 1, Title = "Opening Keynote", Speaker = "John Doe", Time = "09:00 AM" },
                new Session { Id = 2, Title = "AI & Ethics", Speaker = "Jane Smith", Time = "11:00 AM" }
            };
            return View(sessions);
        }
    }
}

SpeakersController

using Microsoft.AspNetCore.Mvc;
using VisualAcademy.Areas.Conferences.Models;
using System.Collections.Generic;

namespace VisualAcademy.Areas.Conferences.Controllers
{
    [Area("Conferences")]
    public class SpeakersController : Controller
    {
        public IActionResult Index()
        {
            var speakers = new List<Speaker>
            {
                new Speaker { Id = 1, Name = "John Doe", Bio = "AI Expert", Topic = "AI & Future" },
                new Speaker { Id = 2, Name = "Jane Smith", Bio = "Philosopher", Topic = "Ethics in AI" }
            };
            return View(speakers);
        }
    }
}

WorkshopsController

using Microsoft.AspNetCore.Mvc;
using VisualAcademy.Areas.Conferences.Models;
using System.Collections.Generic;

namespace VisualAcademy.Areas.Conferences.Controllers
{
    [Area("Conferences")]
    public class WorkshopsController : Controller
    {
        public IActionResult Index()
        {
            var workshops = new List<Workshop>
            {
                new Workshop { Id = 1, Title = "Hands-on AI", Instructor = "John Doe", Time = "2:00 PM" },
                new Workshop { Id = 2, Title = "Ethics & AI", Instructor = "Jane Smith", Time = "3:30 PM" }
            };
            return View(workshops);
        }
    }
}

모델 구성

각 컨트롤러에서 사용할 모델을 정의합니다.

namespace VisualAcademy.Areas.Conferences.Models
{
    public class Ticket
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public decimal Price { get; set; }
        public string Description { get; set; }
    }

    public class Session
    {
        public int Id { get; set; }
        public string Title { get; set; }
        public string Speaker { get; set; }
        public string Time { get; set; }
    }

    public class Speaker
    {
        public int Id { get; set; }
        public string Name { get; set; }
        public string Bio { get; set; }
        public string Topic { get; set; }
    }

    public class Workshop
    {
        public int Id { get; set; }
        public string Title { get; set; }
        public string Instructor { get; set; }
        public string Time { get; set; }
    }
}

View 페이지 구성

Tickets View (Index.cshtml)

@model List<VisualAcademy.Areas.Conferences.Models.Ticket>

<h2>Tickets</h2>
<table class="table">
    <tr><th>Type</th><th>Price</th><th>Description</th></tr>
    @foreach (var ticket in Model)
    {
        <tr>
            <td>@ticket.Name</td>
            <td>@ticket.Price</td>
            <td>@ticket.Description</td>
        </tr>
    }
</table>

Agenda View (Index.cshtml)

@model List<VisualAcademy.Areas.Conferences.Models.Session>

<h2>Agenda</h2>
<ul>
    @foreach (var session in Model)
    {
        <li>@session.Time - @session.Title (Speaker: @session.Speaker)</li>
    }
</ul>

Speakers View (Index.cshtml)

@model List<VisualAcademy.Areas.Conferences.Models.Speaker>

<h2>Speakers</h2>
<ul>
    @foreach (var speaker in Model)
    {
        <li>@speaker.Name - @speaker.Topic</li>
    }
</ul>

Workshops View (Index.cshtml)

@model List<VisualAcademy.Areas.Conferences.Models.Workshop>

<h2>Workshops</h2>
<ul>
    @foreach (var workshop in Model)
    {
        <li>@workshop.Time - @workshop.Title (Instructor: @workshop.Instructor)</li>
    }
</ul>

네비게이션 메뉴 수정

<ul class="navbar-nav">
    <li class="nav-item dropdown">
        <a class="nav-link dropdown-toggle" href="#" id="conferencesDropdown" role="button" data-toggle="dropdown">Conferences</a>
        <div class="dropdown-menu">
            <a class="dropdown-item" asp-area="Conferences" asp-controller="Tickets" asp-action="Index">Tickets</a>
            <a class="dropdown-item" asp-area="Conferences" asp-controller="Agenda" asp-action="Index">Agenda</a>
            <a class="dropdown-item" asp-area="Conferences" asp-controller="Speakers" asp-action="Index">Speakers</a>
            <a class="dropdown-item" asp-area="Conferences" asp-controller="Workshops" asp-action="Index">Workshops</a>
        </div>
    </li>
</ul>

라우팅 설정

app.UseEndpoints(endpoints =>
{
    endpoints.MapControllerRoute(
        name: "areas",
        pattern: "{area:exists}/{controller=Home}/{action=Index}/{id?}");
});

결론

이제 Areas를 활용한 Conferences 모듈화된 웹 애플리케이션이 완성되었습니다. 이를 통해 확장성과 유지보수성이 높은 구조를 만들 수 있습니다.

VisualAcademy Docs의 모든 콘텐츠, 이미지, 동영상의 저작권은 박용준에게 있습니다. 저작권법에 의해 보호를 받는 저작물이므로 무단 전재와 복제를 금합니다. 사이트의 콘텐츠를 복제하여 블로그, 웹사이트 등에 게시할 수 없습니다. 단, 링크와 SNS 공유, Youtube 동영상 공유는 허용합니다. www.VisualAcademy.com
박용준 강사의 모든 동영상 강의는 데브렉에서 독점으로 제공됩니다. www.devlec.com