• Home
  • About
    • 김연중 개발 블로그 🚀 photo

      김연중 개발 블로그 🚀

      개발과 나의 생각들

    • Learn More
    • Email
    • Github
  • Posts
    • All Posts
    • All Tags
  • 개발일기
  • 나의 생각
  • C#
  • ASP.net
  • DataBase
  • CS지식
  • 성장일기
  • JavaScript

ASP.net Core 프로젝트의 유형

2022-07-30 18:35:55

Reading time ~3 minutes

📌 ASP.net Core 프로젝트의 유형

닷넷코어 정리 시작!

해당 포스트는 전적으로 MicroSoft - Docs/.Net/ASP.net Core의 기술문서 정보를 기반으로 작성하였습니다.



ASP .net Core

1️⃣ .net Core? 뭐가 다른데요?

프로젝트 유형을 알아보기 전에 ASP.net과 ASP.net Core의 차이를 알아보고자 한다.
깊숙한 내용보다는 중요한 특징적인 부분이라고 생각되는 부분만 추출하여 짧게 알아보고 넘어가겠다!

  1. 기존에는 Window환경에서만 개발하고 실행할 수 있었지만, 코어는 macOS, Linux까지 지원한다.

  2. .net Core는 오픈소스이다. GitHub에서 수많은 개발자가 기여하고 발전시키고 있다.
    링크: https://github.com/dotnet/core

  3. 기존 .NET Framework로 구현된 .NET Framework 런타임이 아닌, .NET 기반의 .NET Core를 사용한다. (.net Core 3.0 이상부터) 특히, 이 부분에서 차이가 많은 것으로 알고있다. 이하 생략.



2️⃣ ASP.net Core에도 여러 종류가 있다?

기술문서에는 ASP.NET Core는 완전한 UI 프레임워크입니다. 앱의 웹 UI 요구 사항에 맞게 결합할 기능을 선택하세요. 라고 명시되어 있다.
이는 요구사항에 적절하게 부합하는 기술을 정하고 프로젝트를 구축하라는 의미가 내포되어 있다.
.net Core에서 웹 UI를 구축하는 방법은 크게 세 가지가 존재한다.



1. 서버 사이드 랜더링

말 그대로 서버에서 UI를 구성하여 클라이언트 사이드에 넘겨주는 방식을 뜻한다.
요청에 따라 HTML과 CSS를 동적으로 생성하고 응답받은 브라우저는 단지 사용자에게 화면을 보여주면 된다.

서버 사이드 랜더링의 장점

  • 서버에서 논리 및 페이지 생성 작업을 수행하므로 클라이언트에 부하가 적게 들어간다.
    • 저사양 디바이스 및 낮은 대역폭 연결에 적합하다.
    • 클라이언트에서 다양한 브라우저 버전을 사용할 수 있습니다.
    • 초기 페이지 로드 시간이 빠릅니다.
    • 클라이언트로 끌어올 JavaScript가 없거나 최소화됩니다.
  • 다음과 같은 보호되는 서버 리소스에 대한 액세스가 유연해집니다.
    • 데이터베이스 액세스
    • Azure Storage에서 호출한 API 호출 값과 같은 것에 액세스할 수 있다.
  • 검색 엔진 최적화 같은 정적 사이트 분석의 장점을 제공합니다.


서버 사이드 랜더링의 단점

컴퓨팅 및 메모리 사용 비용이 각 클라이언트가 아닌 서버에 집중됩니다. 사용자 상호 작용을 수행하려면 서버와의 왕복을 통해 UI 업데이트를 생성해야 합니다.


.net Core에서 채택할 수 있는 서버 사이드 랜더링 방식

  1. ASP.NET Core Razor Pages
    일반적인 페이지 기반 모델로서 처음 사용하는 개발자가 새로운 페이지 기반 또는 양식 기반 앱을 만들 때 권장되는 방식이다.
    밑에 후술할 MVC에 비해 구조가 단순하기 때문에 쉽게 시작할 수 있다.

  2. ASP.NET Core MVC
    MVC 아키텍처를 적용한 방식으로 요청은 C(controler)에서 처리하고 M(model)을 사용하여 비즈니스 로직을 처리한다.
    마지막으로 V(view)로서 사용자가 요구하는 페이지를 제공한다.



2. 클라이언트 사이드 랜더링

말 그대로 서버에서는 데이터만 던져주고 클라이언트에서 인터렉티브한 UI를 동적으로 구성하게 하는 방식이다.

클라이언트 사이드 랜더링의 장점

  • 서버에 왕복하지 않고도 거의 즉각적으로 다양한 대화형 작업을 수행할 수 있습니다. UI 이벤트 처리 및 논리는 최소 대기 시간을 사용하여 사용자의 디바이스에서 로컬로 실행됩니다.
  • 사용자가 단추를 눌러 양식을 제출하지 않아도 부분적으로 완료된 양식이나 문서를 저장하는 증분 업데이트를 지원합니다.
  • 연결 끊김 모드에서 실행되도록 설계할 수 있습니다. 클라이언트 쪽 모델에 대한 업데이트는 연결이 재설정되면 결과적으로 서버에 다시 동기화됩니다.
  • 서버 부하 및 비용이 줄어들고 작업이 클라이언트에 오프로드됩니다. 많은 클라이언트 렌더링된 앱은 정적 웹 사이트로서 호스트될 수도 있습니다.
  • 사용자 디바이스의 기능을 활용합니다.


클라이언트 사이드 랜더링의 단점

  • 논리에 대한 코드를 클라이언트에서 다운로드 및 실행해야 하기 때문에 초기 로드 시간이 증가합니다.
  • 클라이언트 요구 사항은 저사양 디바이스, 오래된 브라우저 버전 또는 낮은 대역폭 연결을 사용하는 사용자를 배제할 수 있습니다.


.net Core에서 채택할 수 있는 클라이언트 사이드 랜더링 방식

  1. Blazor
    클라이언트단에서 C#코드를 사용할 수 있는 앱이다.
    아무래도 C#을 클라이언트단에서 사용할 수 있기 때문에 많은 라이브러리를 사용할 수 있다는 장점이 있다.
    개발 속도도 빠른 편에 속한다.

  2. ReactJS나 Vue, Angular 같은 JavaScript 프레임워크를 지원하는 ASP.NET Core SPA
    프론트 프레임워크와 함께 .net Core를 사용할 수 있다.
    .net Core는 프론트 프레임워크용 템플릿을 지원하고 있다.
    프론트 프레임워크의 커뮤니티 규모가 상당히 거대하기 때문에 접근성이 좋다.



3. 두 가지 방법의 혼합

자체적으로 하이브리드 솔루션을 구축하는 방법도 있겠지만, 문서에서 제안하는 방법은 Blazor와 Razor or MVC의 결합이다.
ASP.net Core 프레임워크 내에 Razor, MVC, Blazor가 포함되어 있기 때문에 유동적으로 통합할 수 있다고 한다.
위와 같은 방식으로 솔루션을 구축할 때 이점이다.

  • 미리 렌더링하면 서버에서 Razor 구성 요소가 실행되고 보기 또는 페이지로 렌더링되어 인식된 앱 로드 시간이 향상됩니다.
  • 구성 요소 태그 도우미를 사용하여 기존 보기 또는 페이지에 대화형 작업을 추가합니다.





Share Tweet +1