Build a Forum with Inertia and Laravel

Sign in Get started

This episode is for members only

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

Already a member? Sign in to continue

Playing

45. Setting up for best answers

Episodes

0%

Your progress

Total: 6h 54m
Played: 0m
Remaining: 6h 54m

Join or sign in to track your progress

01. Introduction and demo

02. Getting set up

03. Modifying registration for usernames

04. Figuring out the forum layout

05. Creating and listing topics

06. Basic discussion listing

07. Pinning discussions

08. Tackling pagination in Inertia

09. Customising pagination text in Laravel

10. Showing a discussion

11. Setting up discussion posts

12. Listing through discussion posts

13. Adding more data to posts

14. Adding pagination to posts

15. Adding a post preview to discussions

16. Adding the last reply to discussions

17. Outputting discussion participants

18. Limiting participants in the UI

19. Ordering discussions by last post

20. Handling deleted users

21. Counting replies

22. Building our first filter

23. Highlighting current filters, and merging with pagination

24. Adding auth specific filters

25. Adding the topic filter

26. Scaffolding the new discussion form

27. Toggling the create discussion form

28. Keeping form state

29. Storing a new discussion

30. Discussion validation and authorization

31. Generating markdown for posts

32. Toggling the markdown preview

33. Fetching and displaying markdown

34. Adding a markdown shortcut toolbar

35. Dealing with SVG icons

36. Creating the reply form

37. Basic Inertia permission checking

38. Creating replies to discussions

39. Jumping to posts

40. Automatically scrolling to posts

41. Toggling post editing

42. Editing posts

43. Deleting posts

44. Deleting discussions

45. Setting up for best answers

46. Toggling the best discussion answer

47. Solved and unsolved filters

48. Indexing discussions for search

49. Searching discussions

50. Debouncing search

51. Adding mentionable functionality to forms

52. Indexing users for mentioning

53. Hooking up users for mentions

54. Detecting and storing mentioned users

55. Adding the mentioned filter

56. Adding mentions to the markdown toolbar

57. Adding mentions to the reply form

58. Fixing up some unauthenticated state

59. Fixing up post scrolling

60. Reviewing SSR (Server-side rendering)

61. Preventing parent posts from being deleted

62. Improving solution marking

Transcript

00:00

We're going to do a little bit of setup now for probably the most useful feature on the forum, and that is marking a best answer. So in this episode, we'll go ahead and do the setup, take a look at how the relationships work and how we're going to actually access the solution.

00:14

And then in the next episode, we'll look at toggling this. So to start with, we need to really figure out where we're actually going to store the best answer. Are we going to do that on the post itself or are we going to do that on the discussions table with a reference to that post? Well, after a lot of experimenting, the best place to store this on

00:35

is on the discussions table itself. And that way, what you can do is get the best answer as an overall relationship on the discussion itself. And that really helps because you might want to display the best answer elsewhere out of the context of a discussion view. So this offers a lot more flexibility and it doesn't really create any extra complexity at all. So we're going to go

00:59

ahead and first of all, create out a migration and we're going to add a solution post ID to the discussions table. And I've named it like this specifically because solution is the thing that we are looking at. But obviously, this reference is a post ID on the posts table. So that's helpful for just working out what the relationship is. OK, so let's open up that migration and let's go

01:25

ahead and fill this in here. So this relates to a posts table. So we can actually use a foreign ID here. We're going to go ahead and give solution post ID. Now, the only difference to using a foreign ID to what we've already done, for example, when we created out the discussions table, we use foreign ID on user ID and we constrained it. Now, Laravel worked out that this must belong to the

01:52

users table just because of the way that we formatted the column name. However, in this case, solution post ID is a little bit different. So first of all, let's make this nullable because, of course, not every topic or not every discussion is going to have a solution. And now when we say constrained, we actually want to give the post table in. So Laravel knows what

02:14

this is. If it was just post ID, it would work out. But with this solution prefix, it won't be able to. Now, again, really importantly, if a post within here that is already marked as the solution is deleted, we want to set this back to null because then the discussion is not going to have a solution if that particular post with the solution gets deleted. OK, so let's go ahead and fill in the

02:38

down migration. Let's drop that column solution post ID and we are good. Let's go ahead and migrate what we have here and we're done. Now we're going to go ahead and set the relationship up. So if we go over to the discussion model, let's go all the way down to the bottom here and let's create out a solution relationship. This is going to say this belongs to. Might seem a

03:02

little bit odd, but if you think about it, it's the way that you would normally set up a relationship like this. For example, on a discussion, we have a topic which is a belongs to topic. So even though it doesn't seem like a discussion belongs to a solution, it's the most appropriate relationship in this case. So we're going to go ahead and pass in the post here and we'll give the column name

03:24

because once again, Laravel is not going to be able to work this out on its own. OK, so now that we have the solution, let's add the solution to the discussion resource. So let's go ahead and just copy this one down. We'll say solution and when loaded, we want to go ahead and pull that in. So over on the show page, let's just go up to the top of the template and let's just dump out

03:54

the discussion solution here. And what topic are we on? Need help with view. So let's take this post here and say that this is the solution. So let's find the ID for this is 14. So on this one, let's mark this specifically in the database. So let's go over to discussions, need help with view and we'll set that to 14. Let's save that out. And remember, this is not going to show unless

04:23

it's loaded. So over on the discussion show controller, let's go ahead and make sure we load this into our discussion up here. Solution and we may need some other eager loading here as well, just depending. And there we go. There's the solution. Now, once again, the reason that we're outputting this is a completely separate resource is we might need to use this or show this somewhere

04:48

else out of the context of here. Or you might always want to show the solution under the first post or you might always want to show the solution at the top. But what we can really simply do now is just when we're iterating through this list of post based on this, does the ID equal the same thing? Well, then it's the solution. The alternative, of course, because this is a slightly more

05:13

slower solution, because if you think about it, you're outputting the entire resource. You could just do something like solution ID and then just output this solution post ID and then you could still compare it in the same way. So if you find that as you add to this or it does get slower, just remove the entire thing here and just use the solution ID to compare.

05:33

But we're going to output that anyway in case we need it later. So now that we've got this in here, let's go over to show and just get rid of the solution there. What we're now going to do is add in the authorization for whether we can mark something as solved now that we've got that data in there. And then we're going to go ahead and look that later. So I'm going to go ahead and

05:54

get rid of this solution post ID and let's go over to the discussion policy to do this. The reason we're going over to the discussion policy is we want to know if a specific user can solve this discussion at all. Doing this on an individual post does not make sense because if the user owns the discussion, they can choose the solution. So we're going to add this to the

06:17

overall discussion policy. So we're just going to call this solve. And we just, again, want to make sure that the user owns the discussion. So now over on the discussion resource, we can go ahead and add this in here. Let's swap this for solve. And now we can go ahead and output this over on each of the posts. So if we look for the links that we've already got here,

06:40

let's go ahead and say mark best solution. And now remember, we need to go into for this to show post discussion user can solve. So we're going back into that discussion relationship to find out whether we can solve the overall discussion. And that's it. So let's give this a refresh. And at the moment, of course, I can't mark a solution on here at all. I would have to do that on one of

07:08

my own topics. So let's find, well, all of mine have no replies, but you can see that we have mark best solution in here. OK, so now that we've got all of the setup done and we are a little clearer on how this is going to work, let's jump over to the next episode where we're going to look at actually clicking on this to toggle this and show it on the UI.

62 episodes•6 hrs 54 mins•1 year ago

Overview

Ready to build a forum with Inertia and Laravel?

Why a forum? A forum touches a whole load of concepts that you'll use throughout your development career – particularly on the client-side, where we'll be doing most of the heavy lifting.

So, let's build a clean, modern forum with features like markdown support, code highlighting, advanced filtering, user mentions, full-text search, the ability to mark best answers, and more.

Alex Garrett-Smith

Hey, I'm the founder of Codecourse!

Comments

No comments, yet. Be the first to leave a comment.