Flutterのコードジェネレーターfreezedとjson_serializableの基本を完全解説!初心者向けDartデータクラス入門
生徒
「FlutterでAPI通信をするときに、毎回モデルクラスを書くのが大変なんですが、楽にする方法はありますか?」
先生
「FlutterやDartでは、コードジェネレーターを使うことで、データクラスやJSON変換コードを自動生成できます。」
生徒
「コードを自動で作ってくれるんですか?」
先生
「そうです。freezedやjson_serializableを使えば、Flutter開発の効率が大きく向上します。基本から順番に解説していきます。」
1. Flutterのコードジェネレーターとは何か
Flutter開発では、API通信やデータ管理のためにモデルクラスを作成する場面が多くあります。しかし、コンストラクタやコピー処理、JSON変換処理などを毎回手書きするのは手間がかかります。
そこで活躍するのがFlutterのコードジェネレーターです。コードジェネレーターとは、Dartのアノテーションを使ってソースコードを自動生成する仕組みです。Flutterコード生成を使うことで、保守性と可読性が向上し、バグの発生も抑えられます。
特に有名なのがfreezedとjson_serializableです。これらはFlutter初心者から実務開発者まで幅広く使われている定番ライブラリです。
2. json_serializableの基本と導入方法
json_serializableは、DartのクラスとJSONの相互変換コードを自動生成するライブラリです。Flutter API通信では必須とも言える存在です。
まずはpubspec.yamlに依存関係を追加します。
dependencies:
json_annotation: ^4.8.0
dev_dependencies:
build_runner: ^2.4.0
json_serializable: ^6.7.0
次にモデルクラスを作成します。
import 'package:json_annotation/json_annotation.dart';
part 'user.g.dart';
@JsonSerializable()
class User {
final String name;
final int age;
User({required this.name, required this.age});
factory User.fromJson(Map<String, dynamic> json) => _$UserFromJson(json);
Map<String, dynamic> toJson() => _$UserToJson(this);
}
コード生成を実行します。
flutter pub run build_runner build
[INFO] Generating build script...
[INFO] Running build...
[INFO] Succeeded after 3.2s
これでJSON変換コードが自動生成されます。Flutter JSON変換の基本はこれで完成です。
3. freezedとは何かとメリット
freezedは、Dartでイミュータブルなデータクラスを簡単に作成できるコードジェネレーターです。copyWith、比較処理、toStringなども自動生成されます。
Flutter状態管理やAPIレスポンス管理で特に力を発揮します。RiverpodやBlocと組み合わせるケースも多く、Flutter実務ではほぼ必須スキルと言えます。
Flutterを「実務レベル」で使えるようになりたい人や、 iPhone / Android両対応アプリ開発の流れをまとめて学びたい人には、 定番の実践書がこちらです。
Flutter実践開発をAmazonで見る※ Amazon広告リンク
4. freezedの基本的な使い方
まず依存関係を追加します。
dependencies:
freezed_annotation: ^2.4.0
dev_dependencies:
build_runner: ^2.4.0
freezed: ^2.4.0
基本的なデータクラスは次のように書きます。
import 'package:freezed_annotation/freezed_annotation.dart';
part 'product.freezed.dart';
@freezed
class Product with _$Product {
const factory Product({
required String id,
required String name,
required int price,
}) = _Product;
}
ビルドコマンドを実行すると、自動でcopyWithや比較処理が生成されます。
5. freezedとjson_serializableを組み合わせる方法
Flutter開発ではfreezedとjson_serializableを組み合わせることが一般的です。これにより、イミュータブルなデータクラスとJSON変換を同時に実現できます。
import 'package:freezed_annotation/freezed_annotation.dart';
part 'article.freezed.dart';
part 'article.g.dart';
@freezed
class Article with _$Article {
const factory Article({
required String title,
required String content,
}) = _Article;
factory Article.fromJson(Map<String, dynamic> json) =>
_$ArticleFromJson(json);
}
この書き方により、Flutter APIレスポンスモデルが効率的に構築できます。
6. build_runnerの役割とトラブル対策
Flutterコード生成で重要なのがbuild_runnerです。これはソースコードを解析して自動生成ファイルを作成するツールです。
既存ファイルが競合する場合は、次のコマンドを使います。
flutter pub run build_runner build --delete-conflicting-outputs
[INFO] Deleting conflicting outputs...
[INFO] Build completed successfully
Flutterコードジェネレーターでエラーが出た場合は、キャッシュ削除や依存関係の確認も重要です。
7. Flutter初心者が知っておくべきポイント
Flutter初心者がfreezedやjson_serializableを使う際は、まず小さなモデルクラスから試すことが大切です。コード生成の仕組みを理解すると、Flutter開発の効率は大幅に向上します。
特にFlutter API通信、Flutterデータクラス設計、Dartイミュータブルクラスの理解は、実務でも役立ちます。
Flutterコードジェネレーターを正しく活用することで、可読性が高く、バグの少ないアプリ開発が実現できます。初心者のうちからfreezedとjson_serializableに慣れておくことで、将来的なスキルアップにもつながります。
まとめ
今回はFlutter開発におけるコードジェネレーターであるfreezedとjson_serializableの基本について解説しました。FlutterでAPI通信を行う場合、Dartのデータクラス設計は避けて通れません。毎回コンストラクタやJSON変換処理、copyWithメソッド、比較処理を書くのは手間がかかります。しかしfreezedとjson_serializableを活用することで、Flutterモデルクラスの実装は大幅に効率化されます。
json_serializableはDartクラスとJSONの相互変換を自動生成する仕組みであり、FlutterでのREST API通信やバックエンド連携において重要な役割を担います。fromJsonとtoJsonを定義するだけで、複雑なマッピング処理を自動化できるため、ヒューマンエラーを減らし保守性を高めることができます。特にFlutter初心者にとっては、JSON変換の理解とコード生成の流れを知ることが、実務レベルのアプリ開発への第一歩になります。
一方freezedは、Dartでイミュータブルなデータクラスを安全に定義するためのライブラリです。イミュータブル設計はFlutterの状態管理と非常に相性が良く、RiverpodやBlocなどのアーキテクチャでも頻繁に利用されます。freezedを使うことで、copyWithや等価比較、toStringメソッドなどが自動生成され、コードの可読性と安全性が向上します。
さらにfreezedとjson_serializableを組み合わせることで、Flutter APIレスポンスモデルを効率的に構築できます。イミュータブルな設計とJSON変換を同時に実現できるため、大規模なFlutterアプリ開発でも安定したデータ管理が可能になります。build_runnerを用いたコード生成の流れを理解し、delete conflicting outputsオプションを適切に使うことも重要なポイントです。
Flutter初心者の方は、まず小さなモデルクラスを作成し、コード生成の仕組みを体験することから始めてください。Dartアノテーション、partファイル、build_runnerコマンドの関係性を理解することで、Flutterコードジェネレーターの全体像が見えてきます。Flutterデータクラス設計を正しく行うことは、アプリの拡張性や保守性に直結します。
実務で求められるFlutterスキルには、API通信、状態管理、データモデリングの理解が含まれます。freezedとjson_serializableはその中心的な技術です。今回学んだ内容を復習しながら、実際にサンプルコードを動かし、Flutter開発の基礎力を確実に身につけていきましょう。
freezedとjson_serializableを組み合わせた最終確認サンプル
import 'package:freezed_annotation/freezed_annotation.dart';
part 'profile.freezed.dart';
part 'profile.g.dart';
@freezed
class Profile with _$Profile {
const factory Profile({
required String id,
required String name,
required String email,
}) = _Profile;
factory Profile.fromJson(Map<String, dynamic> json) =>
_$ProfileFromJson(json);
}
上記のように定義することで、Flutterデータクラス、JSON変換、イミュータブル設計がすべて自動生成されます。これがFlutterコード生成の強みです。
生徒
FlutterでAPI通信をするときに毎回モデルクラスを書くのが大変でしたが、freezedとjson_serializableを使えば自動生成できることが分かりました。
先生
その通りです。Dartアノテーションとbuild_runnerを使えば、Flutterコードジェネレーターが必要なコードを作ってくれます。
生徒
json_serializableはJSON変換を自動化し、freezedはイミュータブルなデータクラスを作るためのものですね。
先生
よく理解できています。Flutterデータクラス設計では、この二つを組み合わせることで保守性と可読性が向上します。
生徒
build_runnerのコマンドも重要ですね。delete conflicting outputsオプションを使う場面も覚えておきます。
先生
素晴らしいです。Flutter初心者のうちからコード生成の仕組みを理解しておくと、実務レベルのアプリ開発でも役立ちます。継続して実践していきましょう。