Type Null is not a subtype of type int error when tried fetch data from an API

Question

I have tried this for long time now but I cannot get pass this error. I am a beginner level flutter developer. Your help is much appreciated.
This class this is my model class for the data from the API

   class data {
     final int id;
     final String email;
     final String first_name;
     final String last_name;
     final String avatar;
   
     data({
       required this.id,
       required this.email,
       required this.first_name,
       required this.last_name,
       required this.avatar,
     });
   
     factory data.fromJson(Map<String, dynamic> json) {
       return data(
         id: json['id'],
         email: json['email'],
         first_name: json['first_name'],
         last_name: json['last_name'],
         avatar: json['avatar'],
       );
     }
   }

API calling part(this part is the calling)

    import 'dart:async';
    import 'dart:convert';
    import 'package:api_data/models/datamodel.dart';
    import 'package:http/http.dart' as http;
    
    class ApiManager {
      Future<data> fetchAlbum() async {
        final response =
            await http.get(Uri.parse('https://reqres.in/api/users?page=2'));
    
        if (response.statusCode == 200) {
          // If the server did return a 200 OK response,
          // then parse the JSON.
          return data.fromJson(jsonDecode(response.body));
        } else {
          // If the server did not return a 200 OK response,
          // then throw an exception.
          throw Exception('Failed to load album');
        }
      }
    }

Main part

    import 'package:api_data/models/datamodel.dart';
    import 'package:api_data/network/api_data.dart';
    import 'package:flutter/material.dart';
    
    class Testpage extends StatefulWidget {
      const Testpage({Key? key}) : super(key: key);
    
      @override
      _TestpageState createState() => _TestpageState();
    }
    
    class _TestpageState extends State<Testpage> {
      late Future<data> futureAlbum;
    
      @override
      void initState() {
        super.initState();
        futureAlbum = ApiManager().fetchAlbum();
      }
    
      @override
      Widget build(BuildContext context) {
        return Scaffold(
          appBar: AppBar(title: Text('Test2'), centerTitle: true),
          body: Center(
            child: FutureBuilder<data>(
              future: futureAlbum,
              builder: (context, snapshot) {
                if (snapshot.hasData) {
                  return Text(snapshot.data!.email.toString());
                } else if (snapshot.hasError) {
                  return Text("${snapshot.error}");
                }
    
                // By default, show a loading spinner.
                return CircularProgressIndicator();
              },
            ),
          ),
        );
      }
    }

I know this is a really simple task. but I don't understand why this doesn't work properly. When I run this it gives out the error to the screen

type Null is not a subtype of type int

Solution

Welcome to SO,

You are running with Null Safety Enbaled in your project. You have declared your all fields required and non-null in your Data Model Class.

Your API response is having a field absent or having a null value, that's why you are facing this issue.

Solution: Replacing int with int? (making fields optional will resolve issue).Read