We have a lot of internships that we've scraped so far and we cannot fit all of them on the same page (nor retrieve them in a single API call efficiently). We can use a concept called pagination to get a specified amount of internships (from the API). You use this everyday: going to the "next page" to get more results, jumping to certain pages (e.g. page 5 / 10), and you can set how many results per page appear (10 / 25 / 50 / 100).
Since we are using Material as our Angular UI component library, we'll use their built-in Paginator module to implement this functionality (Figure 1).
[x] Only show the specified number of results on each page
[x] When the next page button is clicked, retrieve the next load of internships via API service call
Notes
Figure 1. "Paginator" Material UI component.
Remember that getAllInternships (will eventually) allow you to pass in a limit and skip parameter. The limit parameter is your results-per-page and the skip parameter can be calculated by the following formula:
skip = resultsPerPage * (pageNumber - 1)
For example, if you were requesting 50 internships per page and were on page 3, the limit parameter would be 50 and the skip parameter would be 100 by applying the formula:
Context
We have a lot of internships that we've scraped so far and we cannot fit all of them on the same page (nor retrieve them in a single API call efficiently). We can use a concept called pagination to get a specified amount of internships (from the API). You use this everyday: going to the "next page" to get more results, jumping to certain pages (e.g. page 5 / 10), and you can set how many results per page appear (10 / 25 / 50 / 100).
Since we are using Material as our Angular UI component library, we'll use their built-in Paginator module to implement this functionality (Figure 1).
TODO
internship-list
componentNotes
Figure 1. "Paginator" Material UI component.
Remember that
getAllInternships
(will eventually) allow you to pass in alimit
andskip
parameter. Thelimit
parameter is your results-per-page and theskip
parameter can be calculated by the following formula:For example, if you were requesting 50 internships per page and were on page 3, the
limit
parameter would be 50 and theskip
parameter would be 100 by applying the formula: