1. Exploring Asynchronous JavaScript

Objective: The objective of this assignment is to familiarize students with asynchronous JavaScript concepts using promises and the Fetch API, and demonstrate their practical application in interacting with external APIs.

Problem Statement: You are tasked with developing a web application that interacts with the Marvel Comics API. The application should handle asynchronous operations such as fetching data and updating the user interface dynamically using modern JavaScript features.

Task 1: Obtaining API Key and Configuration

Obtain an API key from the Marvel Comics API website. Investigate and understand the necessary configurations required to authenticate requests to the API. You would need to generate a hash based off of the provide key combo in the documentation. I would recommend using https://www.md5hashgenerator.com/ to generate the hash.

Task 2: Fetching Characters Using Fetch API

Implement a function to fetch Marvel Comics characters asynchronously from the API endpoint using the Fetch API and promises. Utilize the API key and configurations obtained in Task 1. Log the fetched characters to the console.

Task 3: Updating User Interface Dynamically

Write a function to dynamically update the user interface with the fetched characters' information. Utilize promises and the Fetch API to ensure that the UI updates only after the characters are successfully fetched.

Expected Outcomes:

Students should understand the concept of asynchronous programming in JavaScript.
Students should be able to implement promises, and the Fetch API to handle asynchronous operations effectively.
Students should be able to develop web applications that interact with external APIs, such as the Marvel Comics API, and dynamically update the user interface based on fetched data.

Module 10 Lesson 6: Assignments | Async JavaScript and API Interaction