Send asynchronous browser requests with fetch, XMLHttpRequest, JSON, errors, and progressive UI.
Lessons
Send JSON data to the server with fetch.
POST Requests with fetch is easiest to learn by reading the example, changing it, and observing the result.
async function createLesson(data) {
const response = await fetch('/api/lessons', {
method: 'POST',
headers: { 'Content-Type': 'application/json' },
body: JSON.stringify(data)
});
if (!response.ok) throw new Error(`HTTP ${response.status}`);
return response.json();
}
createLesson({ title: 'AJAX Basics', minutes: 30 })
.then(saved => console.log('Created', saved.id))
.catch(error => console.error(error.message));Practice the POST Requests with fetch example in a small scratch file, then explain what changed and why.