This episode is for members only

Sign up to access "Winging A Laravel Comment System" right now.

Get started
Already a member? Sign in to continue
Playing
06. Pagination

Transcript

00:00
We're going to focus on adding pagination now because once we start to add additional features, once we start to give the ability to edit comments, delete comments, redirect back, pagination if we add it last is just going to sort of start to break things.
00:14
We want to know that things are working with pagination enabled from the start so we can work around it. So let's get started and I don't think things are going to work as we expect. So where are we going to paginate? Well we'll do it here where we are caching the latest comments here or ordered comments with all of our eager loading. So let's just switch this
00:38
over to paginate and for now we only have a few comments so I'm just going to paginate by one. Let's go over to the browser and you can see already we get an error here. Now let's go over to comments.blade.php and just check this out. So I'm just going to do like a var dump within the template on comments and let's make sure we clear our view here and
01:00
let's get rid of this here temporarily as well. Okay great so here what we've got is an invocable component variable. What we would expect to see here is a length-aware paginator where we can access the total amount of items. We've got a links method that allows us to access and render out a bunch of links. That's not quite the case at the moment. So the reason that this has happened
01:28
is because when we invoke or use a variable like this to invoke that method that we created, that's the exact property that we get back or the object that we get back. So we're going to make a slight tweak to this in a minute and that is using this like we're actually invoking the method. So actually let's go ahead and change that around.
01:50
Now there won't be any difference to this because we are of course caching this. What we could also do is just to tidy this up in fact let's make sure this works first and you can see that it does. Let's go ahead and add in a php directive up here. Let's say nphp and let's go ahead and assign comments to comments. Now I don't like to write too much pure php within blade components but
02:24
something like this is absolutely fine just to give us a clearer view of our template. Let's switch this one over and let's just double check this and there we go that's still working nicely and you can see we've still got the same amount of queries in here as well. We're not duplicating anything here at all so let's just actually check this and just make sure that we are not
02:50
comments count. Okay so I think we've got one extra query here but we can sort that out a little bit later. Okay so we've got pagination working now how do we render our pagination links? Well we'll do it within this if comments count here. So let's just say comments links and that should give us our pagination which is great. Let's just wrap this in a div so we can
03:15
go ahead and create out a margin on the top here so let's say margin on the top of six. We'll just keep it simple and there we go so pagination should now be working. Here's the top comment let's go to page two that's working let's go to page three that is working as well and of course we get the page numbers up in here as well. So a slight tweak to the way that we
03:36
were doing things let's bump pagination to 10 that should get rid of our links because we don't have any in here. I think the only issue here if we switch this back to one is that this count needs to represent the total amount of comments so let's go over to comments here and instead of count sorry instead of count here this is going to be total. We could change that too but there we go
03:59
so we know we've got a total of three comments split up into three different pages in this case so that's a little more accurate now. Let's change this to paginate by let's say 10 we can always adjust that later and there we go that is pagination done so at least now we've got pagination in place so when we start to add any additional features we can work around pagination.

Episode summary

In this episode, we're diving into setting up pagination for our comments. We talk about why it's smart to get pagination sorted early—basically, it's a pain to retrofit it later after you've already added more features like editing and deleting comments.

We start by switching our comments retrieval to use the paginate method. For demo purposes, we set the pagination to show 1 comment per page so we can clearly see it working. Of course, when we test it in the browser, we get an error! So, we walk through a bit of debugging—checking what kind of object our template receives and realizing we need to tweak how we're passing the comments to the view.

Next, we tidy things up in our Blade template, assigning the paginated results to a variable so everything is more readable. We do a quick check on database queries to make sure we’re not accidentally loading the same stuff twice.

Then, it’s time to add the actual pagination links using Laravel’s built-in pagination method. We put the links in the template with a bit of margin for spacing. Testing it in the browser, we click through the pages to make sure everything works as expected.

Finally, we make a few adjustments—like showing the total number of comments and tweaking the number of comments per page. By the end, pagination is working perfectly and we’re ready to add more features, knowing pagination won’t trip us up later!

Episode discussion

No comments, yet. Be the first!