Utilizando JavaScript para manipular o DOM

// Manipulação do DOM utilizando Javascript nativo
function carregarResumoPost(posts, indiceInicio, quantidade) {

  // Reduzir o corpo em 300 caracteres (resumo)
  posts.map(post => post.corpo = post.corpo.slice(0, 300));

  posts.reverse();

  for (let i = indiceInicio; i < quantidade + indiceInicio; i++) {

    var post = posts[i];

    var mainDiv = document.createElement("div");
    mainDiv.classList.add("card", "mb-4");

    var imgElement = document.createElement("img");
    imgElement.classList.add("card-img-top");
    imgElement.setAttribute("src", apiUrl + post["imagem"]);

    var bodyDiv = document.createElement("div");
    bodyDiv.classList.add("card-body");

    var bodyHeader = document.createElement("h2");
    bodyHeader.classList.add("card-title");
    bodyHeader.textContent = post.titulo;

    var bodyParagraph = document.createElement("p");
    bodyParagraph.classList.add("card-text");
    bodyParagraph.textContent = post.corpo + " ...";

    var bodyLink = document.createElement("a");
    bodyLink.classList.add("btn", "btn-primary");
    bodyLink.innerHTML = "Leia Mais &rarr;";
    bodyLink.setAttribute("href", "post.html&id=" + post.id);

    bodyDiv.appendChild(bodyHeader);
    bodyDiv.appendChild(bodyParagraph);
    bodyDiv.appendChild(bodyLink);

    var footerDiv = document.createElement("div");
    footerDiv.classList.add("card-footer", "text-muted");
    var dataPublicacao = new Date(post.dataPublicacao);
    const ptBRFormatter = new Intl.DateTimeFormat("pt-BR");
    footerDiv.textContent =
      "Postado em " + ptBRFormatter.format(dataPublicacao);

    mainDiv.appendChild(imgElement);
    mainDiv.appendChild(bodyDiv);
    mainDiv.appendChild(footerDiv);

    var blogEntries = document.querySelector("#blogEntries");
    blogEntries.appendChild(mainDiv);
  }
  indicePost += quantidade;
}