Nested Categories and Breadcrumbs with Laravel
This episode is for members only

Sign up to access "Nested Categories and Breadcrumbs with Laravel" right now.

Get started
Already a member? Sign in to continue
Playing
02. Nested sets for categories

Episodes

0%
Your progress
  • Total: 46m
  • Played: 0m
  • Remaining: 46m
Join or sign in to track your progress

Transcript

00:00
In order to output all of our nested categories without creating too many additional queries, and also being allowed to have multiple level deep without having to eager load everything, we're going to use a nested set. For this, the package that we're going to use is laravel nested
00:16
set. And we're going to go ahead and get this set up in this episode. So let's go ahead and get this installed. We'll create our category migration and we'll see what everything looks like. And then in the next episode, I'll show you how to seed all of the data that you need. Okay, let's go down to the installation instructions here, grab the command to pull this in with composer and go ahead
00:37
and install this. Okay, so once that's installed, we need some sort of model. In our case, we're looking at categories, but this could be anything. So let's go ahead and build up a model here called category. And we'll create a migration, a factory and a seeder along with this as well. Okay, let's open up the migration and look at what we need to do here. So create categories table.
00:58
And we just need to fill in first of all the data that we need. So let's go and add in a string here for the title. Let's do the same thing for the slug. And we will make this unique. Of course, we're going to need that to be unique in the URL. And then we need to go ahead and from that package use the nested set method within our migration. That will create a few columns for us. Let's go
01:21
ahead and look at what this looks like when we migrate this across. So let's migrate this, we'll head straight over to our database and have a look here. And sure enough, under our categories, you can see that we've got our title and our slug. But we've also got this parent ID, left and right. So when we start to insert data, we don't really need to worry about the left and
01:41
right columns here, these will be filled in based on the nested set itself and how this builds up. But we'll be able to see the parent ID of each of the columns. This will just be used to effectively calculate what it needs to show underneath each other. Okay, so we've set this up, let's go ahead and create out a really simple page in our app where we're going to be displaying
02:03
these categories. And then we'll look at seeding this data in the next episode. Okay, so over to our editor, let's go ahead and create out a controller for this, we're just going to create out a category index controller, which will list through all of our root categories. First of all, let's build that out and then head over to our web routes. And we can pretty much just do this
02:21
manually. Let's go and create out a categories and point that to that category index controller. And let's go ahead and just add in the middleware that we have here, although this doesn't really matter. Okay, so really importantly, the name here, let's go ahead and change this over to categories, we're going to need to reference this later when we look at our breadcrumbs. Okay,
02:44
so over in the category index controller, let's create our invoke magic method. Let's go ahead and return here a view that we want to see. We'll put this in a categories directory and call that index. And let's go over and create this view. So PHP arts and make view. And we'll call that categories index. Now that we've done that we're going to copy over our dashboard template that
03:05
we've already seen. And we're going to put that into the categories index just here. And we can change around the title. So let's just say categories. And we'll just write categories inside of here. Let's update our navigation just so this is easily accessible. So within breeze, we have this navigation partial, let's go down to where we have our dashboard navigation link and
03:28
just copy this over, we'll point that to the route that we've just created. We'll make that highlightable if it's on that route. And of course, we'll change over the text as well. Okay, so now that we've done that, we should be able to click categories. And we can start to list these out. Once we've seeded this data, let's go ahead and look at that in the next episode.
9 episodes• 46 mins

Overview

Let’s master creating nested categories and displaying breadcrumbs for easy navigation.

We’ll start by setting up and seeding nested categories, recursivly iterating over and displaying them with a nested Blade component, then render and customise breadcrumbs to show a trail of category ancestors.

Finally, we’ll finish up with looking at using wildcard routes to show each category slug for perfectly clean URLs.

Alex Garrett-Smith
Alex Garrett-Smith
Hey, I'm the founder of Codecourse!

Episode discussion

No comments, yet. Be the first!