API Calling with HTTP Library (First API)

 import "dart:convert";

import "package:api_integration_http/Third_Api_Integration/Third_Model_Class.dart";
import "package:flutter/material.dart";
import "package:http/http.dart" as http;

void main() {
  runApp(const MyApp());
}

class MyApp extends StatelessWidget {
  const MyApp({super.key});

  @override
  Widget build(BuildContext context) {
    return MaterialApp(
      title: "Third Api Integration",
      debugShowCheckedModeBanner: false,
      theme: ThemeData(
        appBarTheme: const AppBarTheme(
          backgroundColor: Colors.grey,
          centerTitle: true,
        ),
      ),
      home: const ThirdApi(),
    );
  }
}

class ThirdApi extends StatefulWidget {
  const ThirdApi({super.key});

  @override
  State<ThirdApi> createState() {
    return ThirdApiState();
  }
}

class ThirdApiState extends State<ThirdApi> {
  List<ThirdModel> futureThirdModel = [];

  Future<List<ThirdModel>> fetchThirdModel() async {
    final response = await http.get(
      Uri.parse("https://jsonplaceholder.typicode.com/posts"),
    );
    var data = jsonDecode(response.body.toString());

    if (response.statusCode == 200) {
      for (Map<String, dynamic> index in data) {
        futureThirdModel.add(
          ThirdModel.fromJson(index),
        );
      }
      return futureThirdModel;
    } else {
      return futureThirdModel;
    }
  }

  @override
  Widget build(BuildContext context) {
    return Scaffold(
      appBar: AppBar(
        title: const Text(
          "Third API Calling",
          style: TextStyle(fontWeight: FontWeight.bold),
        ),
      ),
      body: Center(
        child: FutureBuilder<List<ThirdModel>>(
          future: fetchThirdModel(),
          builder: (context, snapshot) {
            if (snapshot.hasData) {
              return ListView.builder(
                itemCount: futureThirdModel.length,
                itemBuilder: (context, index) {
                  return Card(
                    child: Padding(
                      padding: const EdgeInsets.all(8.0),
                      child: Column(
                        crossAxisAlignment: CrossAxisAlignment.start,
                        children: [
                          Text(
                            "Id : ${futureThirdModel[index].id}",
                            style: const TextStyle(
                                fontWeight: FontWeight.bold, fontSize: 18.0),
                          ),
                          const SizedBox(height: 20.0),
                          Text(
                            "Title: ${futureThirdModel[index].title}",
                            style: const TextStyle(fontWeight: FontWeight.bold),
                          ),
                          const SizedBox(height: 10.0),
                          Text(
                            "Body: ${futureThirdModel[index].body}",
                            style: const TextStyle(fontWeight: FontWeight.bold),
                          ),
                        ],
                      ),
                    ),
                  );
                },
              );
            } else {
              return const Center(
                child: CircularProgressIndicator(),
              );
            }
          },
        ),
      ),
    );
  }
}

class ThirdModel {
  final int userId;
  final int id;
  final String title;
  final String body;

  ThirdModel({
    required this.userId,
    required this.id,
    required this.title,
    required this.body,
  });

  factory ThirdModel.fromJson(Map<String, dynamic> json) {
    return switch (json) {
      {
        "userId": int userId,
        "id": int id,
        "title": String title,
        "body": String body,
      } =>
        ThirdModel(
          userId: userId,
          id: id,
          title: title,
          body: body,
        ),
      _ => throw const FormatException("Failed to load ThirdModel"),
    };
  }
}