문서:Blazor

[[분류:Microsoft]][[분류:웹 프레임워크]][[분류:오픈 소스]]
[include(틀:마이크로소프트)]
||||<tablealign=right><bgcolor=#512bd4><color=#ffffff><:>{{{+1 '''블레이저'''}}}[br]'''Blazor'''||
||||[[파일:BrandBlazor_nohalo_1000x.png|width=140&height=140&align=center]]||
||<bgcolor=#512bd4><color=#ffffff><:>'''개발 언어'''||[[C\#]]||
||<bgcolor=#512bd4><color=#ffffff><:>'''최초 릴리즈'''||2018년||
||<bgcolor=#512bd4><color=#ffffff><:>'''종류'''||[[프레임워크]]||
||<bgcolor=#512bd4><color=#ffffff><:>'''라이선스'''||[[아파치 라이선스|Apache License 2.0]]||
||<bgcolor=#512bd4><color=#ffffff><:>'''개발'''||[[마이크로소프트]], [[https://dotnetfoundation.org/|.NET Foundation]]||
||<bgcolor=#512bd4><color=#ffffff><:>'''소스 코드'''||<:>[[https://github.com/dotnet/aspnetcore/tree/master/src/Components|주소]]||
||||<:>[[https://blazor.net|홈페이지]]||
[목차]
[clearfix]
== 개요 ==
마이크로소프트에서 개발한 오픈소스 웹 개발 프레임워크. 유사한 다른 웹 개발 프레임워크 ([[https://reactjs.org/|React]], [[https://angular.io/|Angular]], [[https://vuejs.org/|Vue]] 등)와의 차이점 중 제일 큰 부분은 자바스크립트가 아닌 .NET Core 기반의 C#으로 작성할 수 있다는 것이다.(단점으로는 XAML를 사용하지 않고 HTML과 CSS가 따로 필요하다는 점이다.)이를 위해 최신 웹 표준 중 하나인 [[WebAssembly]]를 채택했으며, 따라서 C#으로 작성된 클라이언트 쪽의 로직 코드들은 전부 .NET Standard Assembly 파일로 컴파일된 후 WebAssembly 런타임 위에서 실행된다.[* 이는 [[Blazor#s-3.2|Blazor WebAssembly]] 에디션만 해당된다.]
== 예시 ==
{{{#!syntax csharp
// Pages/Counter.razor

@page "/counter"

<h2>카운터 예시</h2>

<p>클릭 횟수: @count</p>
<p>최대 클릭가능 횟수: @MaxCount</p>

<button class="btn btn-primary" @onclick="IncrementCount">클릭</button>

@code {
    private int count = 0;

    [Parameter]
    public int MaxCount { get; set; } = 10;

    private void IncrementCount()
    {
        if (count < MaxCount)
        {
            count++;
        }
        else
        {
            Console.WriteLine("최대 클릭횟수에 도달하였습니다!");
        }
    }
}
}}}
{{{#!syntax csharp
// Pages/Index.razor

@page "/"

<h1>블레이저를 이용한 웹사이트</h1>
<p>Hello, World!</p>

<Counter MaxCount="50" />
}}}
== 에디션 ==
=== Blazor Server ===
[[ASP.NET]] [[.NET#Core|Core]] 서버와 Razor 엔진을 이용한 에디션으로, 서버에서 대부분의 렌더링과 프로세싱이 이루어지는 것이 특징이다. 따라서 클라이언트의 부담이 적으며, 서버쪽에서 이루어지는 업데이트들을 클라이언트 쪽에서 [[SignalR]] 을 이용해 수신받는다.
=== Blazor WebAssembly ===
[[SPA(동음이의어)#s-3|SPA]][* Single-Page Application 의 약자로, 웹서버에서 모든 HTML 페이지를 생성하는 전통적인 방식이 아니라 클라이언트 쪽에서 JavaScript나 WebAssembly를 통해 HTML페이지를 생성하며 서버쪽에서는 최소한의 리소스만 반환하는 형태의 웹어플리케이션을 말한다. 이 개념을 채택한 프레임워크로는 대표적으로 React, Angular, Vue 등이 있다. ] 를 구현하는 에디션으로, Blazor Server 에디션과 반대로 SPA 의 특징답게 클라이언트에서 대부분의 렌더링이 이루어진다. 따라서 서버의 부담은 감소하지만 클라이언트의 부담이 높아지는 동시에 클라이언트가 처음 내려받는 파일의 용량도 증가한다.[* 보통 수메가에서 수십메가에 달하는 파일을 내려받게 되지만, 처음 한번만 받으면 된다. 이는 과거 플래시나 실버라이트 등의 RIA로 제작된 어플리케이션의 특징과 동일하다.] 하지만 서버를 거치지 않고 클라이언트에서 모든 로직이 실행되기 때문에 일반적인 윈도우 어플리케이션에 준하는 반응속도와 풍부한 사용자 경험을 제공할 수 있다는 장점이 있다.
=== Blazor PWA ===
현재 기획단계에 있으며, [[PWA]][* Progressive Web Application 의 약자로, 표준 웹 환경에서 동작하지만 다른 네이티브 앱(데스크탑 앱, 모바일 앱 등)과 유사한 경험을 제공한다는 것이 특징. 따라서 따로 설치 과정이 존재하지 않으며, 처음 접속한 이후에는 오프라인 상태에서도 서비스를 이용할 수 있다.] 을 지원하는 에디션.
=== Blazor Hybrid ===
Blazor PWA 에디션과 마찬가지로 현재 기획단계에 있는 에디션. 플랫폼에 종속적이지만 기존 웹 기술[* [[HTML]], [[CSS]] 등]을 이용해 렌더링을 한다.
== 지원하는 플랫폼 ==
 * [[Windows]]
 * [[macOS]]
 * [[Linux]]