対象読者
読者ターゲットは、.NET MAUI Blazorでのマルチターゲットアプリに関心のある初学者~中程度のレベルの方です。
はじめに
連載第1回の今回は、これまでの開発手法との比較、新しいテンプレートの概要、そしてプロジェクト構成について紹介します。
これまでの開発手法との比較
新しいテンプレートの内容を理解するために、まずはクロスプラットフォーム開発手法について整理してみましょう。
開発手法 フレームワーク |
主要技術 | UIコード共有 | ビジネスロジック共有 | ネイティブ機能アクセス | Web対応 | 主な特徴 |
---|---|---|---|---|---|---|
従来のネイティブ開発 | Swift/Kotlin/C# | × | × | ◎ | × | プラットフォーム毎に個別開発 |
Flutter | Dart | ◎ | ◎ | ○ | ◎ | Google製。iOS/Android/デスクトップ/Web対応。高パフォーマンスな独自UI。豊富なウィジェット |
(Xamarin.Forms) .NET MAUI |
C#, XAML | △ | ◎ | ◎ | × | モバイル・デスクトップ向けのネイティブUI。XAMLによるUI設計。高いネイティブ機能アクセス |
Ionic | JavaScript, TypeScript, HTML, CSS | ◎ | ◎ | △ | ◎ | Web技術ベース。WebView経由でモバイル/デスクトップ/Web対応。PWAも可能 |
React Native | JavaScript, TypeScript | ○ | ○ | ○ | △ | Facebook製。JavaScriptでiOS/Androidアプリ開発。ネイティブUIを利用。Web対応は追加ツールで可能 |
Blazor | C#, Razor, HTML, CSS | ◎ | ◎ | × | ◎ | Webアプリ特化。C#とRazorでSPAやPWAを開発。UI・ロジックをWebで最大限共有 |
.NET MAUI Blazor Hybridアプリ | C#, Razor, HTML, CSS, MAUI | ◎ | ◎ | ◎ | × | BlazorのUIをMAUIでホスト。Web技術ベースでネイティブ機能も利用可能。1つのコードベースで複数OS対応 |
新テンプレート | C#, Razor, HTML, CSS, MAUI | ◎ | ◎ | ◎ | ◎ | BlazorのUI・ロジックをMAUI(ネイティブ)とWebの両方で共有。最大限のコード再利用と広範なプラットフォーム対応 |
多くの手法では、ネイティブアプリとWebアプリを別々に開発する必要があり、それぞれのUIやロジックを個別に管理するため、コストや保守性に課題がありました。しかし新しいテンプレートでは、WebアプリとネイティブアプリでUIコードを共有できるため、開発効率が大幅に向上します。コードを一元管理できることで、メンテナンス性や拡張性も高まります。
この新しいテンプレートを活用するには、その構成要素である.NET MAUI(Multi-platform App UI)とBlazorという2つのフレームワークを把握することが重要です。
そこで次に、この2つのフレームワークについて、アーキテクチャ(システム構造)や動作原理をおさらいしておきましょう。
なお、MAUIを含めたマルチプラットフォーム開発については、「Windowsで進化するマルチプラットフォームGUI開発」の記事も参考にしてください。