Hello Everyone.! In this article, we learn about Freezed in Flutter Application. And how it works in Flutter Applications. With the help of freezed, we can reduce the lines of code.
If you’re looking for the best Flutter app development company for your mobile application then feel free to contact us at — support@flutterdevs.com.
Table Of Contents:
Introduction:
Freezed is a code-generation package that helps you to create data classes in Dart. It stops you from writing a ton of error-prone lines. Sometimes you just want a class that obtains its values in a constructor, a toString method, and maybe value impartiality. That lone is a lot. But now visualize you want objects to remain fixed. For that, you need an extra copyWith method. If you know how to implement all this in Dart, you surely know that it takes many lines of code to achieve this.
How to Use Freezed:
- Project Setup:- For using freezed first you need to create a project. Open Android Studio, create a new Flutter Project, and add the project’s name, project location, description, and also domain. For any project, we have to choose the platform, on which we want to run our project. After that, we have to add some dependencies which are necessary to use
- Install:- First we have to add some dependencies in our project by which we can easily use Freezed. Build_Runner, Freezed, Freezed_Annotation.
dev_dependencies:
flutter_test:
sdk: flutter
build_runner: ^2.1.7
freezed: ^1.1.1
freezed_annotation: ^1.1.0or we can add these dependencies by using commands.
flutter pub add freezed_annotation
flutter pub add --dev build_runner
flutter pub add --dev freezed> freezed:- Freezed package is used to create the model. It’s code generator for data-classes/unions/pattern-matching/cloning.
> build_runner:- The build_runner package provides a concrete way of generating files using Dart code, outside of tools like the pub. Unlike pub serve/build, files are always generated directly on disk, and rebuilds are incremental – inspired by tools such as Bazel.
> freezed_annotation:- Freezed_annotations for freezed. This package does nothing without freezed. If we want to use Freezed so we have to use this package without this we can’t use Freezed.
- Run the generator:- To run the code generator, execute the following command.
flutter pub run build_runner build> When the packages providing Builder are configured with a build. ymal file they are designed to be consumed using a generated build script. Most builders should need little or no configuration, see the documentation provided with the Builder to decide whether the build needs to be customized. If it does you may also provide a build. ymal with the configuration.
and also add import the packages in dart file.
import 'package:freezed/builder.dart';- Creating a Model using Freezed:- First, you have to create a class that has the @freezed annotation. We create a class with the name of TestModel{}.
import 'package:freezed_annotation/freezed_annotation.dart';part 'response.freezed.dart';
part 'response.g.dart';@freezed
class TestModel{}After creating the class we define the class with mixins. A mixin is a class whose methods and properties can be used by other classes without sub-classing.
import 'package:freezed_annotation/freezed_annotation.dart';part 'response.freezed.dart';
part 'response.g.dart';@freezed
class TestModel with _$TestModel{}Now we add a factory method as a constructor with a list of all the arguments/properties. Here we have defined @Default inside the factory method which comes from ‘freezed_annotation’.The @Default annotation is used to set a default value for non-required properties.
import 'package:freezed_annotation/freezed_annotation.dart';part 'response.freezed.dart';
part 'response.g.dart';@freezed
class TestModel with _$TestModel {
@JsonSerializable(fieldRename: FieldRename.snake, explicitToJson: true)
const factory TestModel({
@JsonKey(name: 'id') int? id,
@JsonKey(name: 'label') String? label,
@JsonKey(name: 'image') String? image,
@JsonKey(name: 'status') int? status,
}) = _TestModel;And at last, we have now created our constructor, In which we have to implement fromJson/toJson. In the freezed package, fromJson and toJson are not generated, but it knows what json_serializable is.
import 'package:freezed_annotation/freezed_annotation.dart';
part 'response.freezed.dart';
part 'response.g.dart';@freezed
class TestModel with _$TestModel {
@JsonSerializable(fieldRename: FieldRename.snake, explicitToJson: true)
const factory TestModel({
@JsonKey(name: 'id') int? id,
@JsonKey(name: 'label') String? label,
@JsonKey(name: 'image') String? image,
@JsonKey(name: 'status') int? status,
}) = _TestModel;
factory TestModel.fromJson(Map<String, dynamic> json) =>
_$TestModelFromJson(json);
}For creating a response.freezed.dart and response.g.dart we have to run the command if we don’t run this command so our code will show errors. The next step is to navigate within the terminal to the folder where our project is located and execute the following command.
flutter pub run build_runner build --delete-conflicting-outputsConclusion:
In this article, we have been through how to use Freezed in Flutter. In this, you can see how it is to use, how much code will be saved, and also the time we can save by using freezed By using we can perform many operations and create a Flutter application.
❤ ❤ Thanks for reading this article ❤❤
If I got something wrong? Let me know in the comments. I would love to improve.
Clap 👏 If this article helps you.
Feel free to connect with us:
And read more articles from FlutterDevs.com.
FlutterDevs team of Flutter developers to build high-quality and functionally-rich apps. Hire a flutter developer for your cross-platform Flutter mobile app project on an hourly or full-time basis as per your requirement! For any flutter-related queries, you can connect with us on Facebook, GitHub, Twitter, and LinkedIn.
We welcome feedback and hope that you share what you’re working on using #FlutterDevs. We truly enjoy seeing how you use Flutter to build beautiful, interactive web experiences.
