Today has been a battle with this code, as I tirelessly search for a solution. I've been using the fetch API to retrieve values and I can successfully iterate through the first JSON to grab the ID from the album section. Now, my goal is to use a loop to extract values from the second JSON and match them with the corresponding IDs from the first JSON. Specifically, I want to place the values with the same "albumId" from the photo section under each ID obtained from the first JSON.
Any help would be greatly appreciated.
async function getUsers() {
let url = "https://jsonplaceholder.typicode.com/photos?albums";
try {
let res = await fetch(url);
return await res.json();
} catch (error) {
console.log(error);
}
}
async function getPhotos() {
let url2 = "https://jsonplaceholder.typicode.com/photos?photos";
try {
let res2 = await fetch(url);
return await res.json();
} catch (error) {
console.log(error);
}
}
async function renderUsers() {
let albums = await getUsers();
let html = "";
albums.forEach((album) => {
let htmlSegment = `<div class="user"><h2>${album.id}</h2></div>`;
html += htmlSegment;
});
let container = document.querySelector(".container");
container.innerHTML = html;
}
renderUsers();<div class="container"></div>