#100DAYSOFCODE Day81

#100DAYSOFCODE Day81

Blog Page(personal website)

  • fetch 2 pages of data when users first opened
  • changed the fetch render function to OOP
  • refresh more blog posts while the browser window is scrolled to the bottom?

Here is the code to detect if browser window is scrolled to bottom:

let loadedPage = 2
window.onscroll = function (ev) {
  if (window.innerHeight + window.scrollY >= document.body.scrollHeight) {
    // you're at the bottom of the page
    gql(query(loadedPage))
      .then((response) => response.data.user.publication.posts)
      .then((data) => renderBlogCard(data))
    loadedPage++
  }
}

Screen Shot 2021-05-23 at 12.19.02 AM.png