A quick dive into getting started with Lore

Infinite Scrolling: Overview

In this section we'll replace the pagination links with an infinite scrolling approach.

At the end of this section your application will look like this:

Infinite Scrolling vs Pagination

Infinite Scrolling differs from pagination in the following ways:

  1. Instead of letting the user select a page, they can only load the next page
  2. Instead of displaying one page at a time, the results are all combined into a single list

It's important to point out that these are view specific concerns, meaning nothing about creating the experience requires changes to infrastructure or to the API. These needs are all related to how a user interacts with data, and have nothing to do with how data is fetched or stored.

Our Strategy

There's a lot of boilerplate associated with Infinite Scrolling, but it breaks down into two main components:

  • The first is a List that can keep track of all the pages of data, and merges them into a single array. This component also needs to know how to render each item in the array.
  • The second is a Button that the user can press to load the next page of data, which means it also needs to know when there is a next page.

Our strategy will be to create those two components first, and then use them to convert our Feed into an Infinite Scrolling experience.

Next Steps

Ready? Let's get started!