The network, fetch and the API key
So far the data has been fake. Now we download real NASA pictures from the "Astronomy Picture of the Day" (APOD) API.
Network requests use fetch, and we await the response with async/await:
async function load() {
const response = await fetch(url); // wait for the server to respond
const data = await response.json(); // wait for the body to become JSON
}
await pauses the function until the Promise resolves — the code reads top to bottom, even though it's all asynchronous underneath.
The API key. The NASA API requires a key. config.js ships DEMO_KEY — a shared test key. But DEMO_KEY caps at ~30 requests per hour, and you will hit that limit (a few reloads and you're there). So in the homework you'll get your own free key from api.nasa.gov. I'm saying it plainly, because it's not theory — it will happen to you today.
Reliability — a real lesson. We started this course on a different API (SpaceX), but its server was dead (an SSL 525 error). We had to switch. The takeaway: third-party APIs die — they get shut down, changed, rate-limited. Choosing an API is a reliability decision, not just "which has nicer data". NASA APOD is stable and public, which is why we use it.
And the key technical trap we'll cover: fetch does NOT throw when the server returns a 404 or 500. To fetch, that's "a response was successfully received, just with an error status." You have to check for the error yourself.