Creating pagination, initially, seems quite simple – as you only need to return a fixed number of products. However, if we wish to make our pagination interactive and reactive to the product list – it needs to be a bit more advanced. We need to build our pagination to be able to handle different lengths of products – in the case where our product list has been filtered into fewer products.
Creating pagination
Calculating the values
The arithmetic behind creating a pagination component and displaying the correct products relies on four main variables:
- Items per page: This is usually set by the user; however, we'll use a fixed number of 12, to begin with
- Total items: This is the total number of products...