블레이저에서는 Jquery를 사용 못하나요?

🌐 ASP.NET, Blazor, IIS, 웹 Q&A
1

안녕하세요?

asp.net core mvc로 개발을 진행하고 있는데요,
블레이저 서버앱을 통해서 개발을 하고자 합니다.

목표는 MAUI를 통한 모바일앱도 같이 구축하고자하는데요

궁굼한 내용은, 블레이저 WASM을 통해서 개발할지,
서버앱으로 해서, MAUI를 이용해서 Web, mobile, pc를 개발할지 문의드립니다.

근데, maui를 이용하면, pc, mobil, web 다 가능할까요?
사실, 블레이저 wasm, server, maui 용도를 모르겠네요~

이런 개발을 하는데, 모든기능을 개발하는데, 시간이 걸려서,
ui 컴포넌트를 사용하고자 하는데, 블레이저용이 별로 없는것 같아서,
블레이저가 웹기반이다 보니, jquery ui, plugin 을 사용할가 하는데,
의견을 듣고자 합니다.

두서 없지만, 현재 개발하시는 분들의 의견 부탁드립니다.

3개의 좋아요
2

안녕하세요
전체적인건 잘모르기에…
현재 제가 알고 있는 수준에서
용도 정도만 정리해서 말씀드리겠습니다.

Maui

  • Android, IOS, Window, Mac만 개발이 가능하며, Web은 지원하지 않습니다.
  • Maui.Blazor의 경우 Maui 프레임워크 위에 블레이저를 올리는 방식입니다. 블레이저 기반으로 MAUI를 만드는 것이지 Web을 만들 수 있는 것이 아닙니다.

블레이저 wasm, server는 배경만 알고 있는 수준이라 간단하게 정리하겠습니다.

Blazor wasm

  • Vue, React와 같은 SPA 웹입니다. 즉, Client Side Rendering방식이라고 생각하시면 됩니다.

Blazor Server

  • Wasm과 다르게 Server Side Rendering입니다.

Blazor wasm의 경우 Client에서 렌더링하는것이기 때문에 서버에서 렌더링 될 페이지들을 다운로드받아 클라이언트측에서 동작이 됩니다.

3개의 좋아요
3

Asp.Net Core 는 닷넷의 웹앱 프레임워크인데, 아래와 같은 것을 할 수 있습니다.

  1. Web Api 서버
    Web Api 프로젝트 템플릿을 선택하면 됩니다.

  2. WAS 서버 (모두 Web Api 기능 포함)
    MVC, Web App, Blazor Server(.net 8.0 부터는 Blazor Web App으로 변경됨) 프로젝트 템플릿을 선택하면 됩니다.

클라이언트 기술을 여쭤 보시는 것 같습니다.

닷넷은 HttpClient 객체를 제공하는데, 이 객체를 사용하면 어떤 앱도 클라이언트가 될 수 있습니다.
이 객체와 닷넷의 UI 앱 프레임워크를 함께 사용하면 UI를 갖춘 클라이언트 앱을 만들 수 있겠죠?

  1. 웹 프론트 엔드
    Blazor Webassembly 가 일반적인 프론트 앱 역할을 합니다.

  2. 윈도우 데스크탑 앱
    WPF, Winform, … 등등… C#이 강한 분야입니다.

  3. 크로스 플랫폼 앱
    MAUI로 Mac(Mac Catalyst), iOS, Android, Window 용 UI 앱을 만들 수 있습니다.

2, 3 번 프레임워크들은 UI 구성을 XAML 이라고 불리는 xml 파일로 작성합니다.

블레이저

블레이저는 Html 생성 도구로서, 전통적인 프론트 엔드 기술 - Html, Css, Javascript, JQuery - 과 C# 코드로 웹 페이지를 만들 수 있는 기술입니다.
쉽게 얘기하면, 자바스크립트 혹은 제이쿼리의 역할을 C#이 한다고 생각하시면 됩니다.
물론 C#이 자바스크립트를 호출할 수도 있고, 그 반대로도 할 수 있습니다.

C# 웹 기술에는 레이저 페이지라는 것이 있는데, html 과 C# 조합으로 작성합니다.
블레이저는 이 레이저 페이지와 같은 문법으로 레이저 요소를 작성합니다.
레이저 요소는 페이지도 될 수 있고, html tag 처럼 사용할 수도 있습니다.

블래이저 호스팅

아시다시피 프론트 엔드 코드는 서버에 호스팅되어 서비스되고, 브라우저에서 실행됩니다…
Blazor 도 동일한데, 기본적으로 Webassembly 로 컴파일되어 배포됩니다.
따라서, Webassembly 를 지원하는 브라우저에서만 사용가능한데, 요즘은 지원하지 않은 것이 없죠.

그런데, 블레이저는 웹서버 호스팅 뿐만 아니라, 닷넷의 다른 UI 앱 프레임워크들도 Blazor 호스팅을 지원하고, 이를 실행할 WebView 콘트롤을 갖추고 있습니다.

즉, MAUI 도 WPF 도, Blazor 를 내부적으로 호스팅할 수 있고 Webview 콘트롤을 통해 이를 실행할 수 있는 것이죠.

이렇게 되면 뭐가 좋으냐?

시스템 디자인

Front end / Back end 호스팅 분리 전략

  • 백엔드 : Asp.Net Core Web Api
  • 프론트 엔드 : Blazor Webassembly

통합 호스팅 (Full stack)

위와 같이 호스팅 전략은 다르지만, UI는 공통적으로 블레이저로 작성하는 시나리오입니다.

이렇게 작성된 블레이저 코드(레이저 요소)는 Blazor hosted WPF, Blazor hosted MAUI에서 그대로 쓸 수 있습니다.

쉽게 얘기하면, 웹을 위해 작성해 놓은 블레이저 코드를 MAUI에 탑재 시켜 빌드하면, 안드로이드, 맥, iOS, 윈도우 앱이 손도 안대고 나온다는 것이죠.

물론, 각 운영체제 별 자잘한 커스텀이 필요하겠으나, 큰 그림이 그렇다는 의미입니다.

사용은 가능한 데, 블레이저에서는 돔 객체를 블레이저가 관리하다 보니, C# 코드가 건드리지 않는 컴포넌트에 한해서만 자바 스크립트를 사용하는 것이 권고됩니다.

9개의 좋아요