※ これは 2019/11/01 .NET Core 3.1.0 preview1 時点の情報です
最新版では動作が異なる可能性がありますのでご注意ください
.NET Core 3.0 が正式リリースされたということで、この .NET Core 3.0 の C# を使って、まだ Preview 版ですが Web ブラウザ上でオフラインでも動く Single Page Application が作れる Blazor WebAssembly をさわってみることにしました
なぜ突然さわってみることにしたかというと、XAML + C# で構築していたクライアントアプリが将来的に HTML + CSS + (C# or TypeScript) で構築する方向に向かうのではないかと思ったからです
スポンサードリンク
XAML や C# で発展したデータバインディングや async/await、LINQ などは他のプラットフォームでも受けいれられつつあるなかで、XAML はまだまだ敷居が高くなかなか普及しきれていない
だったら HTML + CSS で同じようなことができればいいじゃないか、みたいな予想です
ちなみに他にも Electron や Flutter もさわってみる予定です
そういうわけで、やってみた手順は下記の通り
まずは下記のページから .NET 3.1 preview SDK のインストール
Windows 64bit の Installer のリンクからダウンロードしてインストールしました
次にコマンドプロンプトからコマンドをたたいて Blazor webassembly テンプレートをインストール
dotnet new -i Microsoft.AspNetCore.Blazor.Templates::3.1.0-preview1.19508.20
バージョン番号の部分は今後変わりそうな予感
次に IDE 立ち上げ・・・ですが今回はせっかくなので Visual Studio ではなく他の OS でも使える VSCode でやってみます
C# の最新拡張プラグインが入っていなかったら下記からアップデートしておきます
VSCode で適当なフォルダを開いたらターミナルから下記コマンドを入力
dotnet new blazorwasm -o SPA
すると Blazor WebAssembly のプロジェクトが生成されます
このままだとビルドができないようなので SPA/SPA.csproj を開いて <PropertyGroup> のタグ内に <LangVersion>8.0</LangVersion> を追記して保存します
こうしないと C# 8.0 でビルドしてくれませんでした
さらにターミナルから下記コマンドを続けて入力
cd SPA dotnet run
ビルドが走った後にターミナルに次のようなログが出力されました
info: Microsoft.Hosting.Lifetime[0]
Now listening on: http://localhost:5000
info: Microsoft.Hosting.Lifetime[0]
Now listening on: https://localhost:5001
info: Microsoft.Hosting.Lifetime[0]
Application started. Press Ctrl+C to shut down.
info: Microsoft.Hosting.Lifetime[0]
Hosting environment: Production
info: Microsoft.Hosting.Lifetime[0]
Content root path: D:\2_Documents\2_Sources\Blazor\SPA
URL の http://localhost:5000 の部分を [Ctrl] + 左クリックするとブラウザで開けるので押下してみると・・・
サンプルの Blazor Web アプリが表示されました！
なお、VSCode のターミナルに戻って [Ctrl] + [C] でデバッグを停止することができました
かんたんですね