Practice & Assessment
Test your understanding of Async JavaScript: Promises, Async/Await, and Fetch API
Multiple Choice Questions
5What does an async function always return?
What does Promise.all() do when one of the promises rejects?
Why should you check response.ok after a fetch() call?
How do you handle errors in an async/await function?
What is the correct way to run two fetch calls in parallel using async/await?
Coding Challenges
1GitHub Profile Viewer
Build an HTML page with an input field for a GitHub username and a Search button. When clicked, use the GitHub public API (https://api.github.com/users/{username}) to fetch the user's profile. Display their avatar, name, bio, public repos count, and followers count in a card. Handle loading state (show a spinner or text), invalid usernames (404 response), and network errors gracefully.
Mini Project
Weather Application Using OpenWeatherMap API
Build a weather app that accepts a city name from the user. Use the OpenWeatherMap API (free tier) to fetch current weather data. Display: city name, temperature, weather description, humidity, wind speed, and a weather icon. Add a recent searches list that shows the last five cities searched. Handle all error cases: invalid city, empty input, network failure. Use async/await throughout and update the DOM dynamically. Style the card to match the current weather condition (sunny, cloudy, rainy).