漫画管理アプリ「ほんだな」を作るとき、フレームワーク選びで少し悩みました。 候補は .NET MAUI と Flutter の2つです。
MAUIという選択肢
C#をメインに書いてきたので、MAUIは自然な選択肢でした。 以前に自力で書いたこともあって、「書ける」という感触は持っていました。 .NETのモダンな設計思想も、受け容れつつありました。
それでも今回はFlutterを選んでいます。
理由①:AI × 知らない言語を試したかった
今回の開発は Claude Code(AIアシスタント)と一緒に進める前提でした。
MAUIなら自分でも書ける。でも「AIと組み合わせたら知らない言語でどこまでできるか」は、まだ試したことがありませんでした。
Flutter / Dart は書いたことがありません。だからこそ試す価値があると思いました。 AIがコードを書いてくれるなら、言語の壁はずっと低くなるはず——そのくらいの気持ちで飛び込んでみました。
結果、いい感じでした。「何を作りたいか」を日本語で伝えると、Dartのコードが出てきて、動く。 言語を知らなくても、やりたいことは全部実現できました。
理由②:XMLのタグが「同じ情報を2回書かせる」のが気になった
もう一つ、技術的な理由もあります。
MAUIのUIはXAMLで書きます。こういう書き方です。
<Button Text="追加" Clicked="OnAddClicked">
</Button>
Button という名前を開きタグと閉じタグで2回書く必要があります。
「同じ情報は一度だけ書く」というのが自分の持論でして、 2箇所に同じことが書いてあると、片方を変えたときにもう片方も変えなければなりません。 変え忘れがバグになりますし、変更箇所が純粋に倍になります。
FlutterはDartのコードでUIを書くので、こういった冗長さがありません。
ElevatedButton(
onPressed: _onAddPressed,
child: const Text('追加'),
)
名前は1回だけ。すっきりしています。
実際に1画面作るとどうなるか
タイトルと著者名を表示するシンプルな一覧画面で比べてみます。
MAUI(XAML)
<ContentPage xmlns="http://schemas.microsoft.com/dotnet/2021/maui"
xmlns:x="http://schemas.microsoft.com/winfx/2009/xaml"
x:Class="MangaApp.MangaListPage"
Title="ほんだな">
<StackLayout Padding="16">
<CollectionView ItemsSource="{Binding MangaList}">
<CollectionView.ItemTemplate>
<DataTemplate>
<StackLayout Padding="8">
<Label Text="{Binding Title}" FontSize="16" />
<Label Text="{Binding Author}" FontSize="12" TextColor="Gray" />
</StackLayout>
</DataTemplate>
</CollectionView.ItemTemplate>
</CollectionView>
<Button Text="追加" Command="{Binding AddCommand}" />
</StackLayout>
</ContentPage>
ContentPage、StackLayout、CollectionView、CollectionView.ItemTemplate、DataTemplate——
タグを開くたびに、同じ名前が閉じタグとしてもう一度登場します。
Flutter(Dart)
class MangaListPage extends StatelessWidget {
const MangaListPage({super.key});
@override
Widget build(BuildContext context) {
return Scaffold(
appBar: AppBar(title: const Text('ほんだな')),
body: ListView.builder(
itemCount: mangaList.length,
itemBuilder: (context, index) {
final manga = mangaList[index];
return ListTile(
title: Text(manga.title),
subtitle: Text(manga.author),
);
},
),
floatingActionButton: FloatingActionButton(
onPressed: _onAddPressed,
child: const Icon(Icons.add),
),
);
}
}
Scaffold、ListView.builder、ListTile——それぞれ1回しか登場しません。
同じ画面を作るのに、名前の重複がない分だけコードが見通しやすいです。
AIと組み合わせると、知らない言語への心理的なハードルはかなり下がります。 C#の経験があってモバイルに踏み出したいなら、Flutter × AI の組み合わせは試してみる価値があると思います。