Mentions And Notifications

Mentions And Notifications

Community based websites often times allow you to mention another user by screen name. For example, if you post a message to Twitter and include a user’s name including the @ symbol, then the user will get a notification that you mentioned them. This tutorial will recreate that type of feature in the forum based application we have been building. In the replies area of threads, if a user types in a reply and includes @Tom as an example, then when Tom logs into his account he should see a notification in the upper right navigation bar area to alert him that he has a thread to check out.…

How To Highlight New Content For Returning Visitors

How To Highlight New Content For Returning Visitors

The goal of this lesson will be to set up a mechanism where by we can highlight new content to returning visitors of the website. So for example, consider a user visits the site and reads all of the threads on the front page and then leaves for the day. Later, a different visitor visits the site and adds a new reply to say three different threads.…

Setup Notifications For Subscribed Users

Setup Notifications For Subscribed Users

In the last tutorial, we saw how to set up the ability for a user to subscribe to a thread. So what does that mean for the user? Well, if they are subscribed to the thread, then they likely would like to stay up to date with any new replies or activity on that thread. In this tutorial, we’ll look at how to set up Notifications.…

Laravel Subscription System Tutorial

Laravel Subscription System Tutorial

Many popular websites allow you to subscribe to a particular topic or thread. In forum type applications, you often see the ability to subscribe to certain topics, and once you are subscribed you can get notifications via email or on the website itself. In this tutorial, we will build out a thread subscription system. It is fairly involved as it needs the back end system to power it, in addition to a reactive subscribe button powered by VueJS on the front end.…

VueJS Bootstrap Pagination Component

VueJS Bootstrap Pagination Component

In this tutorial we will look at porting the built in Laravel pagination features into a full blown Vue paginator component which uses Bootstrap for styling. Along the way, we’ll introduce a few new concepts like tapping into the created() life cycle hook as well as setting up a watch: life cycle hook. Our new paginator will be a child component of the Replies.vue component, so we’ll need to also set up a lot of communication between these components using props, events, and event listeners.…