Project 22: Video Player Layout

JS Wizard

Builds on these lessons

Async Await Fetch Fetch Api Async Iterators Abortcontroller Fetch Cancellation

Step 1 of 3

Project

async/await

Write an async function loadVideoData() that awaits a promise-returning lookup instead of chaining .then(). await pauses just that function until the promise settles, letting the rest of the code read top-to-bottom like synchronous code — the same promise underneath, a cleaner surface on top.

🎯 Your Task

Please add the exact code shown in the light gray box below to your editor.Do not delete your previous code, just insert these new lines in the correct place!

function fetchVideoMeta(videoId) {
  return new Promise((resolve) => {
    setTimeout(() => resolve({ id: videoId, title: "Episode 1" }), 400);
  });
}

async function loadVideoData(videoId) {
  const meta = await fetchVideoMeta(videoId);
  console.log(meta);
}

loadVideoData(1);

← Previous Next →