# Fetch API `fetch()` returns a Promise. Combined with `async/await`, it lets you load data from any server without page reloads. Every modern web app is built on this foundation. ## GET, POST, PUT, DELETE The four HTTP methods — each with its own purpose and request shape: `fetch()` only rejects on network failure (no connection, DNS error). A `404` or `500` response resolves successfully — the Promise fulfills. Always check `res.ok` (true for 200–299) or `res.status` before calling `res.json()`. Otherwise you silently process an error response as if it were data. ## Promise States — Visualized Watch what happens to a Promise through its lifecycle: Every fetch needs two awaits: one for the network response (`await fetch(url)`), and one to read the body (`await res.json()`). The body is a stream — reading it is also async. Miss the second await and you get a Promise object instead of your data. ## Callbacks → .then() → async/await The evolution of async patterns — and why async/await wins: Never chain `await fetch(a)` then `await fetch(b)` when you need both — that's sequential and doubles your wait time. Use `Promise.all([fetch(a), fetch(b)])` to run them simultaneously. The result arrives when the slowest one completes. ## Your Challenge Write `loadMenu()` using async/await. Fetch `/api/menu`, check `res.ok`, parse JSON, render cards with `createCard()`. Wrap in try/catch — show `.error-banner` on failure. Then write `loadAll()` using `Promise.all` to fetch menu and specials in parallel.