No site da AluraPlay só aparecem os sites que são fixos no html, os vídeos do db.json não estão linkados na api por algum motivo.

No HTML está assim:

 <script src="./js/mostrarVideos.js" type="module"></script>

O mostraVideos.js está assim:

import { conectaApi } from "./conectaApi.js";

const lista = document.querySelector("[data-lista");

function constroiCard(titulo, descricao, url, imagem){
    const video = document.createElement("li");
    video.className = "videos__item";
    video.innerHTML = `
    <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>`

    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();

E o conectaApi.js está assim:

async function listaVideos(){
    const conexao = await fetch("https://localhost:3000/videos");
    const conexaoConvertida = await conexao.json();

    return conexaoConvertida;
}

export const conectaApi = {
    listaVideos
}