Lesson 10 of 10

Async JavaScript

Lesson 10: Fetch API and Final Practice

Get data from the internet, handle errors, and complete your beginner capstone projects.

Learning Goals

Example

async function loadUsers() {
  try {
    let response = await fetch("https://jsonplaceholder.typicode.com/users");
    let users = await response.json();
    console.log(users);
  } catch (error) {
    console.error("Could not load users", error);
  }
}

loadUsers();
Rule: always handle errors when loading external data.

Capstone Project Ladder

  1. Price Calculator (inputs + total output).
  2. Grade Tool (if statements + loops).
  3. Task Manager (arrays + objects + localStorage).
  4. API Dashboard (fetch + list rendering + error message).

Final Assessment Checklist

Final Challenge Set
  1. Return the largest number in an array.
  2. Create a login check with two input rules.
  3. Render product cards from an array of objects.
  4. Validate a form with at least three fields.
  5. Fetch and display 3 users from a public API.
← Previous Lesson Back To Hub