This was the final project for the Software Engineering Basics course of Viking Code School’s prep work. The task was to create pagination for the Viking Store e-commerce app that I created stories for in Pivotal Tracker in an earlier assignment. The projected involved creating new stories for the pagination and then writing pseudocode for each of them. In the previous design of the website, products were all displayed on a single page, the home page, rather than multiple results pages. Since the inventory has increased, the product owner wants to add pagination at the bottom of each page, so that items can be listed on multiple pages.
Visual examples of the pagination bar requested can be seen here:
The requirements included showing at least the page to either side of the current page and always showing at least the first two and last two pages as numbers. Ellipses were to be included for pages in between.
To start, I created stories and added them to the Pivotal Tracker project as follows:
Next, I wrote the pseudocode that would create the pagination. Before creating the full pagination, I prioritized a next/previous links story to simply allow for multiple pages and simple navigation. I then added the current page number to the next/previous feature. After this was complete, I wrote pseudocode for the more complete pagination bar with numbers. Some of the considerations I had to make were different pagination displays for when a user is on the first page, the last page, a single page (when it is the only one), a middle page, and others.
For the project, the program was allowed the following assumptions: it knows what page the user is currently on, it can be asked if it is on the first or last page, it knows how many total pages there are. The server could be asked for the correct link for the next, previous, or a numbered page. It was also specified that the sequence of the words/numbers, while important, did not have to be considered in the pseudocode for this project.
Based on the assumptions, I created the following variables that the program already had entered and could use in the pseudocode:
- totalPages – an integer value of the total pages
- currentPage – the current page the user is on