Fiz o código basicamente como ela fez e não está aparecendo os vídeos igual apareceu na aula. Pelo console do Chrome aparece uma referência ao um erro 404
Pelo terminal, aparece erros semelhantes http://localhost:3000/videoGET /video 404 9.030 ms - 2 GET /video 404 1.558 ms - 2 GET /video 404 13.540 ms - 2 GET /video 404 13.050 ms - 2 GET /video 404 12.292 ms - 2 GET /video 404 13.830 ms - 2 GET /video 404 13.649 ms - 2 GET /video 404 13.454 ms - 2 GET /video 404 0.689 ms - 2 GET /video 404 7.452 ms - 2 GET /video 404 10.208 ms - 2 GET /video 404 7.197 ms - 2 GET /video 404 32.463 ms - 2 GET /video 404 14.610 ms - 2 GET /video 404 16.608 ms - 2 GET /video 404 10.300 ms - 2 GET /video 404 5.617 ms - 2 GET /video 404 3.575 ms - 2 GET /video 404 12.450 ms - 2 GET /video 404 6.261 ms - 2 GET /video 404 16.701 ms - 2 GET /video 404 13.638 ms - 2
Meus códigos:
//ConectaAPI.JS
async function listaVideosZ(){
const conexao = await fetch ('http://localhost:3000/video');
const conexaoConvertida = await conexao.json();
return conexaoConvertida;
}
export const conectaAPI = {
listaVideosZ
}
//mostraVideos.js
import { conectaAPI } from "./conectaAPI";
const lista = document.querySelector('[data-lista]');
function constroiCard(titulo, descricao, url, imagem) {
const video = document.createElement('li');
video.className = "videos__item";
video.innerHTML = ` <li class="videos__item">
<iframe width="100%" height="72%" src="${url}"
title="${titulo}" frameborder="0"
allow="accelerometer; autoplay; clipboard-write; encrypted-media; gyroscope; picture-in-picture"
allowfullscreen></iframe>
<div class="descricao-video">
<img src="${imagem}" alt="logo canal alura">
<h3>${titulo}</h3>
<p>${descricao}</p>
</div>
</li>`
return video;
}
async function listaVideos(){
const listaAPI = await conectaAPI.listaVideos();
listaAPI.forEach(elemento => lista.appendChild(constroiCard(elemento.titulo, elemento.descricao, elemento.url, elemento.imagem)));
}
listaVideos();
Alguém tem alguma ideia do que pode ser?