In this article, What we are gonna learn is about how we can fetch API in the flutter app using Riverpod instead of the Future.
**Riverpod; “**Also a provider but a different one”
What you do here is Create a Provider and Consumer the Provider. But today we are just gonna see how to make API calls.
flutter create my_project_name
Go to the pubspec file and add the dependencies’.
dependencies:
flutter:
sdk: flutter
cupertino_icons: ^1.0.0
flutter_riverpod: ^0.12.1
http: ^0.12.2
Go to JSON place holder/photos and copy the JSON raw and paste JSON to dart and give your class name to generate the model class.
[
{
"albumId": 1,
"id": 1,
"title": "accusamus beatae ad facilis cum similique qui sunt",
"url": "https://via.placeholder.com/600/92c952",
"thumbnailUrl": "https://via.placeholder.com/150/92c952"
}
]
Now create a model.dart
file copy the generated code and place it under lib/model/model.dart
class PhotoModel {
int albumId;
int id;
String title;
String url;
String thumbnailUrl;
PhotoModel({this.albumId, this.id, this.title, this.url, this.thumbnailUrl});
PhotoModel.fromJson(Map<String, dynamic> json) {
albumId = json['albumId'];
id = json['id'];
title = json['title'];
url = json['url'];
thumbnailUrl = json['thumbnailUrl'];
}
Map<String, dynamic> toJson() {
final Map<String, dynamic> data = new Map<String, dynamic>();
data['albumId'] = this.albumId;
data['id'] = this.id;
data['title'] = this.title;
data['url'] = this.url;
data['thumbnailUrl'] = this.thumbnailUrl;
return data;
}
}
This how your model class will look.
#flutter #api #mobile-apps #programming #developer