Freek Van der Herten has a tutorial posted on his site sharing the 2018 edition of how to build a dashboard powered by Laravel, Vue, Pusher and Tailwind CSS. It's based on a project they use internally to keep up to date on current work, events and even music people are listening to.

At Spatie we have a tv screen against the wall that displays a dashboard. This dashboard displays the tasks our team should be working on, important events in the near future, which tasks each of our team members should be working on, what music they are listening to, and so on.

[...] This dashboard is not entirely new. The initial version was published a couple of years ago. At our company, we like to tinker with new stuff. That's why we perform a big cleanup of the source code every year. We also update all the dependencies and technologies used. This year we focused on updating the design. The dashboard now uses Tailwind CSS. In this blog post, which is an update to the previous one, I like to explain how this dashboard is built.

He starts with a bit of history of the project and a look at the UI before diving into the code. The remainder of the (lengthy) tutorial is then broken down into functional pieces, each with code and explanation:

• the creation of the markup for the grid
• a closer look at the "internet connection" component
• a closer look at the "statistics" component
• the use of "dark mode" depending on the sun being up
• displaying sites that are down

There's also a mention of the security requirements involved in the creation and use of the dashboard, the hardware used to show it on the TV and how data is saved to prevent the need for the initial "reboot" of the data.

The TutsPlus.com site has continued their series looking at using the Pusher real-time communication service in your PHP application with a new tutorial. In this latest article, they show the use of presence channels, a feature that makes it simpler to know which users are connected to which channels.

In this series, we've been learning about Channels from Pusher, a platform that allows you to give your users the seamless real-time experience they want.

Presence channels build on the security provided by private channels, but they add the benefit of knowing which users are subscribed and connected to that channel. The best part is how easy it is to implement and use presence channels, and it's even easier if you've already configured your app to use private channels.

As in the previous articles in the series, they've provided both a screencast of the tutorial and the text-based version. They show how to modify the server you've already created to authorize a user and send that information along with the messages back to the Pusher service. They also include the changes to the frontend client to gather and send user information.

The Laravel News site has posted the third part of their series about the construction of helpdesk software. In this latest article they integrate Nexmo for real-time messaging using Nexmo Stitch.

Welcome back to the third and final (for now!) part of the Deskmo series. In Part 2 added support for voice calls, with text-to-speech and transcription support.

Today, we’re going to add in-app messaging using Nexmo Stitch. Stitch takes care of all of the heavy lifting for real-time chat, providing you with a websocket that you connect to and listen for events relating to your application.

The article starts by listing out some prerequisites (a Nexmo client account and the Deskmo project) as well as an installation of the Nexmo Stitch command-line client. It then walks you through the process of setting up a Nexmo user profile for each user in the helpdesk software and updating the database with this new information. It then shows how to add in-app notification messaging and linking the messages and tickets together with a conversation ID. With Stitch installed you can then create the chat interface and link the backend to the Nexmo service as a user easily sending and receiving messages.

Matt Stauffer continues his series covering features in the 5.4 version of the Laravel framework with this look at real-time facades, a feature that allows you to use facades on classes without having to pre-define them as before.

Laravel 5.4 introduced a new feature called “real-time facades”, which provide the convenience of facades, defined real-time instead of in classes. Taylor tweeted about it, but I wanted to explain what they are and how they work.

[...] If you’re not familiar with facades in Laravel, they’re shortcut classes that provide static access to non-static methods on service classes bound to Laravel’s container. [...] Real-time facades let you create your own facades on the fly. Instead of having to create a facade class like the Session facade class I referenced above, you can use a class as its own facade by adding Facades to the beginning of its own namespace.

He includes code showing how facades are used and what kind of functionality they offer. He then covers the switch to the real-time version, switching up the namespace to tell the framework to perform the new logic. He ends the post with examples of this functionality in use inside of a view, class or any other library in your application.

The SitePoint PHP blog has posted a new tutorial showing you how you can add real-time notifications to a Laravel application with the help of the Pusher service.

The modern web user expects to be informed of everything that happens within the application. You don’t want to be that one website that doesn’t even have the notifications dropdown found not just in all social media websites, but everywhere else these days, too.

Luckily, with Laravel and Pusher, implementing this functionality is a breeze. The code we’ll write in this tutorial can be found here.

Pusher makes use of Websockets to relay messages back out to waiting clients, sending a push notification (hence the name of the service) rather than waiting for it to poll them for the latest updates. The tutorial starts off by creating a new Laravel installation based on a "blog" example. It then creates the "followers" migration and model and builds out the relationships between it and the user handling. From there they show how to create the routes for following/unfollowing users, the code to perform the action and how to use Laravel's own notifications functionality to integrate with the queue. With that in place they include code to show the current messages (last five) and output the Javascript required to push the messages out to waiting clients.

On his Medium.com blog Laravel project lead Taylor Otwell shares some of his thoughts on expressive code and real-time facades and how they make things simpler, event for testing/mocking.

Recently, I worked on some code that surfaced my most common use-case for Laravel 5.4’s “real-time” facades. If you’re not familiar with this feature, it allows you to use any of your application’s classes as a Laravel “facade” on-demand by prefixingFacades to the namespace when importing the class. This is not a feature that is littered throughout my code, but I find it occasionally provides a clean, testable approach to writing expressive object APIs.

To illustrate he uses the code from the Laravel Forge service talking about service providers (like DigitalOcean, Linode, etc) and "service" classes to contain API methods. He then shifts over to the controller to see how he'd like to access it, making a generic Provider class with a make method to create the instance. This has an issue, however, with testing making it very difficult. Instead he shifts over to the real-time facades and a factory where the test can more easily manually mock the method into a stub provider (example included).

The SitePoint PHP blog has a new tutorial posted from Christopher Pitt showing you how to set up real-time notifications and Follows with Stream in a Laravel application. Stream is a service that helps to take some of the burden out of creating "scalable newsfeeds and activity streams" with just a bit of extra code.

With Laravel, it’s pretty easy to create newsfeed sites, blogs, or even forums where people post content, comment, or even mark some of these posts as favorite. To spice things up, we can make the app more lively by adding notifications for actions performed by other users. In this tutorial, we’ll be relying on a service called Stream to add this functionality to our app.

Using this repository as a starting point how shows how to create a simple blog with some real-time features along with the usual CRUD operations on the blog posts themselves. He starts off by walking through the setup of the project in a Homestead Improved environment. Then it's on to the functionality:

• setting up the user "follow" model and migration
• creating the routes for the follow functionality
• building out the controller and view templates

With that basic structure in place he then brings in the Stream functionality via the get-stream/stream-laravel package. He shows how to set up an application on the Stream site, configure the connection and add in the functionality to send notifications when posts are created.

On the Laravel News site there's a post talking about a feature coming in the 5.3 version of the Laravel framework - Laravel Echo (not a separate system, just an enhancement inside the framework).

Laravel Echo is coming to Laravel 5.3 and is designed to be an improvement over the current event broadcasting system. [...] In this video, Taylor steps through the features by demoing a little to do app. You can see the full source code to the demo on GitHub.

Echo is essentially an improvement on the in-application messaging to provide more real-time feedback between users in the system. In his demo, he makes use of the Vue.js framework heavily and custom broadcasters and Pusher.

The Scotch.io site has a tutorial posted showing you how to combine Laravel and the Twitter Streaming API to process tweets in real time inside your application.

This tutorial will show how to use the Twitter Streaming APIs to process tweets in real-time from a Laravel application. There are a variety of use cases for this: perhaps you want to auto-respond to mentions of your company, run a contest via Twitter, or create support tickets when users complain about your product. For this tutorial, we'll build a "featured tweets" widget to display approved tweets on our app's home page.

He starts with an overview of the tools and terms you'll need to know about for the tutorial and a few notes of things to watch out for. He then describes the overall structure of the application (an app just to show the tweets) and links to a repository for the impatient. He then breaks up the rest of the tutorial into several steps:

• Creating a new Laravel application and installing the Phirehose library
• Building a "process tweet" job and matching TwitterStream class to use Phirehose and dispatch the job
• Make the artisan command to connect to the API and the application you created
• Configure your queue driver and run the processing command
• Set up a "Tweet" model to connect the application and database table

He finishes the post showing how to make the ProcessTweet Job useful, set up some basic authentication and pass the currently processed tweets into the default "Welcome" view.

On the SitePoint PHP blog they've posted a tutorial showing you how to build a chat application with Ratchet, a library in PHP that lets you work with WebSockets for more real-time communication between your frontend and backend systems.

In this tutorial, we’ll be taking a look at Ratchet, a PHP library for working with WebSockets. Let’s start by defining what WebSockets are. MDN says: "WebSockets is an advanced technology that makes it possible to open an interactive communication session between the user’s browser and a server. With this API, you can send messages to a server and receive event-driven responses without having to poll the server for a reply. Connected computers image."

WebSockets allow us to write applications that can pass data from the browser to the server and vice-versa in real-time.

They start by helping you get Ratchet installed (via Composer) and start immediate in on the code. They create the application namespace, a Chat class and client to handle the WebSocket connection. They create methods for the open, close, write and read for the connection and make a simple script with a Ratchet server to handle the messaging back and forth. They also explain the various pieces of the system: the IoServer, HttpServer and WsServer. Finally they help you create the HTML frontend (using jQuery and Handlebars) and the CSS/Javascript to finish off the functionality.