MudBlazor 소개

dimohy · 1월 10, 2022, 6:52오전

앞전에 MudBlazor에 대한 소개를 간략히 한 적이 있습니다.

MudBlazor는 Blazor용 컴포넌트 라이브러리로 GitHub에서 2.1K의 준수한 지지를 받고 있는 프로젝트이며
Awesome Blazor에서 Ant Design Blazor, MatBlazor, Blazorise와 함께 상위 위치에 있는 프로젝트입니다. MudBlazor의 장점은, 기존 응용 애플리케이션 프로그래머가 CSS나 자바스크립트에 숙달되어 있지 않아도 웹 애플리케이션을 빠르게 시작할 수 있는 환경을 제공해 준다는 점입니다. 패키지 종속성이 간결하며 프로젝트 템플릿을 제공해 빠르게 동작하는 프로젝트를 구성할 수 있습니다.

기본 템플릿 뿐만 아니라 대시보드 템플릿도 제공해줘 빠르게 대시보드 형태의 웹 애플리케이션을 구축할 수 있습니다.

Material 디자인을 채택하고 있어서 현대적으로 깔끔한 느낌의 화면 구성이 가능합니다. 좀 더 자세한 내용은 아래의 링크를 통해 확인하실 수 있습니다. (MudBlazor로 구축된 MudBlazor 사이트 입니다.)

그리고 TryMudBlazor를 통해 온라인으로 MudBlazor의 기능을 코딩으로 확인해 볼 수 있습니다.

jamesnet214 · 3월 28, 2022, 3:17오전

@dimohy React + MUI 프로젝트를 6개월 정도 경험하고 나서 MUI의 블레이저 버전이라 할 수 있는 MudBlazor를 접하게 되었는데요!
(둘 간의 관계는 모르겠습니다 )

아직 몇일 안됐지만 너무 맘에들고 좋네요
늦었지만 좋은 글 감사합니다!

dimohy · 8월 9, 2022, 3:18오후

MudBlazor 글을 다시 소환합니다 ^^

MudBlazor는 정말 쓸만합니다! MudBlazor가 이런 것이구나 느끼는 가장 빠른 방법은 MudBlazor Docs를 확인하는 것입니다.

다양한 컴포넌트를 제공하고 있으며 특별한 경우가 아닌 이상 제공하는 기능을 그대로 이용해도 액티브한 예쁜 화면 구성이 됩니다.

저는 필요할 때마다 문서에 쉽게 접근할 수 있는 목적으로 엣지 브라우저의 앱으로 설치 기능을 이용합니다.

이후 테스크바에 이쁘게 위치합니다.

문서는 Blazor Webassembly로 제공되므로 최초 초기 시간이 조금 있습니다.

제 컴퓨터에서 대략 3초 정도에 화면이 표시되므로 괜찮은 수준 같습니다. 이후 접근하는 모든 페이지는 바로바로 뜨거든요.

MudBlazor는 정말 알찬 컴포넌트를 제공합니다. Components 목록에서 하나씩 클릭해서 바로 그 동작을 확인할 수 있습니다.

API도 잘 정리되어 있습니다. 컴포넌트 예제 코드와 함께 보면 대부분 이 문서만 있으면 해결이 됩니다.

MudBlazor는 또한 테마 시스템이 있어서 만드는 애플리케이션에 테마를 제공할 수 있고요,

레이아웃을 구성하기 위한 Stack이나 Grid등의 컴포넌트를 제공하므로 WPF에 익숙한 개발자라면 쉽게 MudBlazor로 애플리케이션을 만들 수 있습니다.

제 개인적인 경험으로는 다른 유명한 Ant Design Blazor나 MatBlazor, Blazorise (Blazorise 유저도 상당히 많습니다)에 비해 깔끔하고 빠른 동작성을 보입니다.

훌륭한 Validation 시스템을 가지고 있어서 상당히 짧은 코드로 아래와 같은 결과를 만들 수 있습니다.

Drag&Drop의 동작은 상당히 미려합니다. 왠간한 환경보다 좋군요.

파일 업로드 기능 또한 컴포넌트로 제공이 되어 장치를 직접 제어하는 애플리케이션이 아닌 이상 대부분의 서비스 애플리케이션을 만드는데 무리가 없습니다.

Blazor로 서비스 개발 계획이 있으시다면 MudBlazor를 강력히 추천합니다 ^^

jamesnet214 · 8월 10, 2022, 1:29오전

@dimohy 저도 MudBlazor 개발 사례가 있는데 아주 훌륭합니다.

(React MUI를 사용해본 경험이 있으신 분들은 훨씬 더 사용하기 좋습니다.)