Getting Started with Pusher and Laravel 5.5 Event Data Binding (Part 1)

Building modern dynamic website and messaging applications require some responsive features such as notifications, popups and lot more. My experience with Laravel framework has been increasing endlessly as i build on.

First before we proceed to creating our first web pusher application, we will signup at https://pusher.com/ to enable us access the pusher scripts, token access and others package we might need later.

Requirement for this to work are as follows: Laravel (PHP), Database (SQL), and Jquery, Pusher which are JavaScript

Token Access id, secret and key

Next we are going to integrate the pusher lib or scripts into our Laravel web application.

composer require pusher/pusher-php-server

Now at the .env file on your Laravel Application you have to edit these

PUSHER_APP_ID=322700
BROADCAST_DRIVER=pusher

// Get the credentials from your pusher dashboard
PUSHER_APP_ID=XXXXX
PUSHER_APP_KEY=XXXXXXX
PUSHER_APP_SECRET=XXXXXXX

Before the </head> section of your application you will have to require the pusher lib.

Then you edit the config/app file

You have to uncomment this..

Should looks like this..

Now we have to create Event that will listen to changes “SendPost”

Now we are going to test our pusher using the normal create post system, this allow user to create post.

html for post

browser view

Ajax posting from form

web.php

at the Events/SendPost.php

Note: by default no broadcastWith method, and implements ShouldBrocast will be added to the class SendPost, so we manually add those lines.

Now we can catch and listen to the Event using our Pusher….

pusher config

We console.log(data), this will return data from the Event Class

To console in other to return data