Web開発者が始める .NET MAUI Blazor App
- 1. Web開発者が始める.NET MAUI Blazor App 株式会社SAKURUG エンジニアリングユニット 草場 友光 .NET ラボ 2022年6月
- 2. 自己紹介 • 普段は主にWebFormsアプリ の保守のお仕事をしてます。 • 古めのシステムが多いので時 代に取り残されぬよう新しい技 術を一つでも入れるよう日々努 力しています。 • tomo_kusaba
- 4. 注意 • 個人の見解・解釈が多分に入っています。 • 見解の相違・事実誤認などありましたらご指摘ください。 • #dotnetlabでtweetすると右側に表示されます
- 5. 今日の目的 • .NET MAUIがとうとうGAしました。 • .NET MAUI Blazor Appはその中でもBlazor技術を使い Android、iOS向けのモバイル開発ができるフレームワークで す • Web開発者視点でどれだけ違和感なくモバイル開発に入ってい けるかを紹介していきます。
- 6. 本日やってることは。。。 • Blazor WebAssemblyで実装してWebページとして公開しても 変わらないとかいう突っ込みはなしで！ • きっと、それぞれのプラットフォームでのネイティブアプリ ケーションになるというところに価値があるのです。
- 8. .NET MAUI Blazor Appとは？ • Android、iOS、macOS、Windowsにデプロイできる • Razorコンポーネントを使用可能 • Blazor WebAssemblyと同じ感覚でアプリケーション開発可能 • あくまでUIを構築する手段としてのBlazor • .NET MAUIの提供するGPSや加速度APIなどのネイティブAPI へのアクセスを含むさまざまなAPIが使用可能
- 9. .NET MAUI Blazor Appのしくみ BlazorWebVeiwコントロール Blazorコード
- 11. 前提条件 • Visual Studio2022 Previewおよび.NET Multi-Platform App UI開発ワークロードをインストール • Microsoft Edge WebView2 • Android Emulatorのパフォーマンス向上のためHyper-Vおよ びHAXM(Intel CPU)の有効化
- 12. プロジェクトを作ろう • .NET MAUI Blazorアプリのテンプレートを選択
- 13. Windowsで動かしてみた
- 17. Razorコンポーネント • WebAPIからの情報を表示す るだけならBlazor WebAssemblyと全く同じ • これで、モバイル向けネイ ティブアプリケーションがで きるのはすごい
- 24. デバイスセンサーへのアクセス • 例えば加速度センサーDocsのサンプル 日本語訳が微妙すぎてこの引数がよ くわからん 次のコード例は、加速度計の変更を監視する方法を示しています。 イン スタンスは Accelerometer.Default メソッドに ToggleAccelerometer 渡されます。 ？？ 次のコード例は、加速度計の変更を監視する方法を示しています。 イン スタンスは ToggleAccelerometerメソッドに Accelerometer.Default が渡されます。
- 31. 参考文献 • Radzen Blazor Componets Get Started • Android用の .NET MAUI アプリを発行する • BlazorWebView を使用して .NET MAUI アプリで Blazor Web アプリをホストする • .NET MAUIBlazor アプリを構築する
- 32. おしまい おしまい