오 Blazor Hybrid 웹까지 포함하는 템플릿이 나왔었군요


image

Blazor 게시판에 적어야할지 MAUI 게시판에 적어야할지 애매해서 자유게시판에 적어봅니닷

기존 Blazor Hybrid에 웹까지 지원하는 템플릿이 생겼네요. (뒷북 아니죠…?)

프론트를 작업하는 프로젝트가 별도로 있고 MAUI 프로젝트랑 Blazor 프로젝트가 종속되어 사용하는 형태군요.

Blazor 하나 익혀 두면 이제 어지간한 앱은 다 커버가 될 듯 한데
웹프론트 기술은 너무 귀찮은거도 많고 불편하단 말이죠 ㅠㅠ

그래도 반대로 요즘 대세는 웹프론트 기술로 이것저것 만드는 추세이니 나름 닷넷에 대한 진입장벽이 좀 낮아지지 않을까 하는 생각도 듭니다 ㅎㅎ

2 Likes

MAUI Blazor 가 MAUI Blazor Hybrid 랑 같은 건가요?
WebApp는 또 ㅠㅠ?
먼가 네이밍이 복잡하네요.

MAUI Blazor가 Blazor Hybrid 안에 있다고 보시면 됩니다! Blazor 프론트 기술로 MAUI, WPF, WinForm 등 기존 프론트앱의 UI 프론트 기술을 대체 가능한데 이걸 Blazor Hybrid라고 부르고, 그 안에 MAUI Blazor Hybrid 템플릿이 있는거구요. WebApp은 그냥 쉽게 웹페이지라고 생각하시면 됩니다.

고로 저 템플릿을 사용하면 Blazor 프론트 기술로 모바일(Android, iOS), 데스크탑(Windows, Mac), 웹페이지 모든 클라이언트 UI 부분을 한번만 작성하시면 되는겁니다! 더 쉽게 생각하시면 Blazor Hybrid로 Flutter 마냥 한번 UI 코드를 작성하면 모든 클라이언트 프론트에서 사용하실 수 있는 템플릿이 나왔다고 보시면 됩니다.

이전에도 위 링크의 회원님이 작성해주신 것처럼 불가능한 것은 아니었지만 이제 템플릿으로 쉽게 생성할 수 있게 되었다는 점을 알리려 한거구요!

웹앱이라는 말에 추가적인 설명을 붙이자면 리액트를 필두로 최근(이젠 오래되었다고 할 수 있지만요) 웹프론트 기술은 SPA 형태로 나아가고 있는데 앱 형태로 웹페이지를 만드는걸 웹앱이라고 부르기 시작하면서 SPA 형태는 보통 웹앱이라고 부르는 경향이 있습니다. 개인적으론 클라이언트 사이드인 Blazor WASM만 웹앱이라고 불러야 하지 않나… 라는 생각이긴한데 사실 웹앱이란 말은 쓰는 사람마다 다 정의가 다른 느낌이라 느낌으로 그런갑다~ 생각하는 편입니다 ㅋㅋ

아마 틀린 부분은 다른 분이 대댓 달아주실거라 믿습니다…

MAUI Blazor => Blazor Hybrid 로 리네임된게 아니라는 말씀이신가요? 음…
Blazor Hybrid 안에 있다? 음…
MAUI Blazor 구성요소가 원래 MAUI이고 내용을 Blazor 로 구성하겠다는 거였는데…
Hybrid 라는 단어랑 WebApp 이란 단어랑 추가적으로 붙으니 제가 생각에 사족같은 템플릿명이 아닌가 아니면 잘못알고 있는게 아닌가 해서요…
Blazor 는 역시 웹을 기반으로 하기 때문에 WebApp 일테고…ㅠㅠ

버전 별 네이밍 차이입니다.

6.0 인가 7.0 인가에서는 Maui Blazor App 이라는 템플릿이 있었고, 그 다음 버전에서 MAUI Blazor Hybrid App 이라는 이름으로 바뀌었습니다.

아 템플릿 명을 여쭤보신거면 이름만 바뀐게 맞습니다 ㅎㅎ 기존 MAUI만 쓰는 Blazor Hybrid도 있습니다 ㅎㅎ

Maui Blazor Hybrid and Web App 템플릿은 Maui Blazor Hybrid 템플릿과 Blazor Web App 템플릿이 컴포넌트를 공유하는 방법을 보여 주는 템플릿입니다.

그런데, 주의할 점이 있습니다.
이 템플릿의 Blazor Web App 은 블레이저가 Asp.Net Core 에서 호스팅 되는 모델을 따르고 있습니다.

만약, 여기에 Wasm Interactive 컴포넌트가 있다면, 수 메가에 달하는 wasm이 Asp.Net Core 서버에서 다운로드되는데, 이는 서버 운영비의 상당량을 차지하는 대역폭이 wasm 다운로드하는데 소비될 수 있다는 점을 의미합니다.

링크된 글은 이러한 단점을 없애기 위해, Blazor WebAssembly Standalone 탬플릿을 선택하여 순순 프론트엔드 앱으로 작성한 것입니다.
프로젝트 빌드 결과물은 정적 서버, 대표적으로 깃허브 페이지나, CDN에 배포할 수 있습니다.

정적 서버는 보통 대역폭 별 과금이 없어, 정적 호스팅 업체에 지불하는 비용은 없거나, 매우 적은 금액(연간 몇 만원 수준) 입니다.

실제로, 제가 운영하는 토이 프로젝트를 Blazor WebAssembly Standalone(와즘 크기는 3메가 수준) 작성하고 클라우드 플래어 CDN에 배포했는데, 어떤 달은 대역폭이 10기가도 우습게 넘기더군요. 그래도 여전히 무료로 사용하고 있습니다.

부담해야할 대역폭 비용은 Asp.Net Core Web Api 로 한정됩니다.
대역폭 비용 뿐만 아니라, 서버가 렌더링을 하지 않기 때문에 CPU 자원도 아낄 수 있고, MAUI/ WPF/윈폼 하이브리드와 궁합도 좋습니다.(링크된 글이 보여준 점이죠)

그런데, 더 중요한 것은 PWA 배포입니다. 블레이저 와즘 앱은 PWA 로 자동으로 설정 가능하기 때문에, 어느 운영체제 건 사이트 접속했을 때, 앱을 설치할 수 있습니다.
예를 들면, 닷넷데브 사이트도 PWA 를 지원합니다.
image

사용자가 앱을 설치하면, 사이트로 접속하지 않아도 됩니다.

3 Likes

이런 함정이… 추가 설명 감사합니다 ㅎㅎ

매우 개선된 모델이군요. 자세한 설명 감사합니다.

1 Like

이건 좀,치명적이네요 ㅋㅋ,
아쉽,