※ これは 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] でデバッグを停止することができました
かんたんですね