blazor試し書き

posted in: C# | 0

松山事務所のくろもんです。
私が使えるプログラミング言語の中で、書きやすいために気に入っているC#(C#.NET)ですが、つい最近、このC#でSingle Page Application(SPA)を作ることができるBlazorというWebフレームワークが正式にサポートされるようになったことを知りました。
まだ正式サポートの範囲内はBlazor Serverという種類のみのようで、一部はオフラインでも動作可能となるBlazor WebAssemblyは2020年5月以降にサポート対象となる予定だそうですが、Blazorの書き方に興味がわいたのでサンプルを触ってみました。

サンプルのテンプレートの取得

Blazor は .NET Core 3.x で動作するため、以下のdotnetコマンドを使ってテンプレートを作成することができます。

テンプレートの中身について

比較のため、.NET Core MVC のテンプレートをdotnet new mvcで作成し、同じソリューションにまとめました。
プロジェクト比較
プログラムの起動部(Program.cs)と設定部(Startup.cs)にほぼ違いはありません。
大きく違っているのは、当たり前ですがControllerがなく、Pages内の個々のページのファイルに、対応するURLが設定されていることでしょうか。

より詳しく

参考として、作成された画面のうち、もっとも単純なPages/Counter.razorを確認します。
Counter

1行目の@pageでURLを設定します。
後は7行目の@onclickでボタン押下時に実行される関数を設定し、
関数の中でcurrentCountが増加することで、
5行目で参照されている@currentCountが更新されます。
本来ならばjavascript等でElementを更新しなければならないところが、フレームワークが隠蔽して、自動で更新されるようになっています。

今後の展望について

BlazorはWebより(オンライン専用)かデスクトップ(モバイル)よりかで5段階くらいの構想があるらしく、Web寄りから順にBlazor ServerBlazor WebAssemblyBlazor PWABlazor HybridBlazor Nativeという名前になっているそうです。
ただ、Blazor PWA以降はまだ実験段階でしかないとか。いずれは、Electronのように、Webの技術とC#のみでデスクトップアプリケーションを作ることができるようになるのでしょうか。今後の動向に期待しています。

LINEで送る
Pocket