Showing a discussion: Build a Forum with Inertia and Laravel

00:17

So let's make a controller in here called discussion show controller. And let's go ahead and create our route for this, first of all. So we really only have two routes for what we're seeing. So for this, we want to get the discussion.

00:35

Of course, you can add a prefix to this if you want, like discussions, but we'll just keep this super clean and just pass the discussion in. And let's reference the discussion show controller. And of course, we'll change the name over this to discussions and show. Great.

00:51

OK, so now that we've got the discussion show controller, let's just scaffold out a really basic inertia page for this. So let's use inertia the helper to render out a page. And let's just remind ourselves what we did over on the forum index controller. We put this in a forum folder so we can do the same thing, but just show.

01:12

OK, so let's create that page out down here and we'll do that under forum show dot view. And let's create our really basic template with show just so we know this works. OK, so when we are passing down the discussion, we don't want this referenced by ID. We want this referenced by slug.

01:32

So really importantly, we're just going to add slug into there so we can pass the slug in instead. So let's choose one of these topics. So let's say need help with Laravel. And let's just go over and verify that this is working.

01:44

And sure enough, we see the page. Now, before we go on to that page, let's link through for each of these discussions and have that click over. So on the discussion component, what we're going to do is change this overall component to a link component, which means we can click any area of this and we'll create an href here through.

02:05

And we'll use the root helper, which comes from Ziggy to go to discussions and show. Now, of course, we need to actually pass the discussion in. But with Ziggy, what we can do is just pass the discussion straight in. If you're not aware what Ziggy is, it basically shares the routes from Laravel to your client side so you can reference them by their name rather than having to rely on using the entire URL.

02:30

So now we don't see anything because we haven't pulled in the link component from Inertia. Let's do that now. So from Inertia view three, and we should now see each of our discussions. Now, we've got a few styling issues here, but that's fine.

02:44

We'll fix that up in a minute. But we can now at least click through onto each of these discussions to see them. So let's fix this up here. We are just going to set this to a block and we're done.

02:56

So we can click anywhere in this area here to view a discussion, which is a lot more convenient. OK, so for the page itself, for the actual discussion, it's going to be very similar to the index because we already have this forum layout which we've created. So what I'm actually going to do is copy this entire page over to that show page and then we'll just delete what we don't need. So to delete what we don't need, we don't need the select here.

03:23

We need the pagination. We don't need the discussion and we don't need an input label, at least not for yet. So for the head, let's fix that up first. For the title, we're going to bind this in instead.

03:36

That's going to be the discussion title, which we want. And let's look at the rest of this. We don't need the top bit here. That's going to become our discussion title.

03:48

So we can just dump that out here for now. And we don't need to iterate through over our discussions because that's going to be our posts. And the side is going to be just similar, so we're going to add the navigation component to that a little bit later. So we don't even have a discussion passed down to this just yet.

04:09

So let's change this to discussion because from the discussion show controller, we're going to pass the discussion we get through here with root model binding. So let's pull the discussion in here and then let's pass that down, not forgetting to make this an API resource. So we'll say discussion resource make and we'll pass the discussion down. Let's go over and click through.

04:34

And there we go. We've got the discussion. The title is being set here as well, which is really helpful. And then, of course, we can iterate through all the posts a little bit later.

04:42

So we're going to go ahead and just start this section up here. First of all, we're going to be a little bit lazy because we don't have any specific components for our topic yet or any of that kind of stuff. We can tidy that up later. So over on the discussion component, let's grab what we need, like the topic title, whether it's pinned and a discussion title.

05:02

So I'm pretty much going to grab all of this in here and I'm going to copy that over to our show component just up here. So let's just paste this in. Go ahead and re-indent this. And let's just take a look.

05:21

OK, so the problem here at the moment, if we just actually look at the console, is we don't have a title for the topic. That's because that is not being loaded in. So over on the discussion controller, show controller, we're going to say discussion, load, and we're going to load that topic in. Normally, we wouldn't need to do that, but because over in the discussion resource we've used when loaded, this won't appear until we've specifically asked for it.

05:48

So now we see Laravel, we get that pinned functionality, and of course, we see the title. There's a little bit of duplication going on here, but it doesn't matter too much. We can always move this over to a separate component later. So if we change something like pinned, we can just change it in one place.

Sign up to access "Build a Forum with Inertia and Laravel" right now.

Episodes

Transcript

Episode summary

Episode discussion