Playing
01. Introduction and demo

Transcript

00:00
If you need to add mentions to anywhere in your application, this course is going to show you how. So we're going to be building out an example comment form here with Livewire,
00:09
but if you are not dealing with a comment system, that's absolutely fine, this is going to work in exactly the same way. And if you're not working with Livewire, that's absolutely fine too. The core functionality of this, which is independent of the front end, works in pretty much the same way.
00:24
We are going to look at an example of showing this on the UI, but as far as submitting the data through, detecting mentions, and then going ahead and syncing them in the database and notifying users, this will work independently of the client side. So let's take a look at how this works.
00:42
So I've got two users in the application at the moment, and we're working with username mentions, which you can change this to anything at all. It could be mentioning projects, GitHub issues, anything like that. So I'm just going to start by typing, and I'm just going to hit the at symbol here. And you can see that on the client side, we've got a suggested list of users that we can
01:01
go ahead and mention. So I'm Alex, so I'm going to go ahead and mention Tabby here, and I'm going to go ahead and post this through. Now it kind of looks like nothing's happened here, but a couple of things have happened. The first thing is we've synced this up in the database, so this is now associated with this comment. So we know who has been mentioned in what comment,
01:21
or which discussion, or project, whatever you're dealing with. The other thing that's happened here is we have gone ahead and notified the user. Now in our case, we're just working with email, but you could push this to the database, you could push it to SMS, Slack, anything that Laravel Notification supports. But you can see here, you were mentioned in a comment
01:42
by Alex. I can click on that, and then that goes down to the comment that we actually posted. And if there were more comments here, it would push this down to the bottom. So the other thing that we're doing is using Markdown to not only link through to a user's profile like this, but we're also in the back-end checking if this user exists or not before we make
02:06
this a Markdown link. So if, for example, Tabby deleted their account, this would become unclickable. So we're covering as much as possible here to give you a really well-rounded system of mentions. We'll be running tests alongside this as well, so we can ensure that these things are actually getting synced up properly in the database. And really importantly, making sure
02:27
that we're not sending too many notifications every time we say edit a comment. So if I go ahead and edit this, and I, you know, add some more text in here, it doesn't really matter what we want to do, and hit edit, that is not then going to go ahead and re-notify that user, even though they're still mentioned inside of the comment. Okay, let's go ahead and start to
02:48
build this out from scratch. We'll build this comment system up just so we've got an idea of how everything is working, and of course you can skip that if you just want to go through the core functionality and get this built into your own application. But let's get started and we'll end up with all of this ready to go and use in your own projects.
15 episodes1 hr 52 mins

Overview

Add mentionable functionality to your Laravel applications and mention users, projects, issues… literally anything.

We’ll start by setting up a simple comment system with Livewire, then detect, sync, notify and test mentions step-by-step. Not using Livewire? Don’t worry, the core functionality works with any stack.

If you are using Alpine/Livewire, we’ll add mention support to textareas to get a list of users we’re able to mention when we hit a trigger key.

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

Episode discussion

No comments, yet. Be the first!