abrhambas01 · March 29, 2020 18:13 · Mar 29, 2020 · Mar 29, 2020 · Mar 29, 2020 · Mar 29, 2020
diff --git a/the-steps.md → steps_i've_made.md b/the-steps.md → steps_i've_made.md
@@ -102,6 +102,7 @@ key: 1c63d178a9cdc73ac98359b7b976418a
 
 ```
 
+
 > this is what my webpack.mix.js 
 
 ```js
@@ -138,9 +139,67 @@ mix.minTemplate('storage/framework/views/*.php', 'storage/framework/views/')
 
 - I open the terminal and ran
 
+```
+$ laravel-echo-server start             
+                                        
+L A R A V E L  E C H O  S E R V E R     
+                                        
+version 1.6.0                           
+                                        
+⚠ Starting server in DEV mode...        
+                                        
+✔  Running at localhost on port 6001    
+✔  Channels are ready.                  
+✔  Listening for http events...         
+✔  Listening for redis events...        
+                                        
+Server ready!                           
+                                        
+```
+
+then I added this in `bootstrap.js`
+```js
+
+import Echo from "laravel-echo" ;
+
+window.io = require("socket.io-client");
+
+console.log("URL:"+process.env.MIX_APP_URL);
+
+window.Echo = new Echo({
+	broadcaster: 'socket.io',
+	host : process.env.MIX_APP_URL + ':6001'
+	// key : '1232b570ab3e5024b5e9d',
+	// cluster : 'ap1',
+	// encrypted : true
+});	
+```
+
+then I added this in my ChatApp.vue my main chat view
+
+```js
+	mounted(){
+
+		let channel = Echo.channel('public')
+
+		axios.get('/getAll').then(({data}) => {
+			this.messages = data;
+		});
+
+		// Registered client on public channel to listen to MessageSent event
+		Echo.channel('public').listen('MessageSent', ({message}) => {
+			this.messages.push(message);
+		});
+
+		console.log('Component mounted.');
+
+	}
+```
+
 ```
 $ npm run watch
 $ php artisan queue:work 
 ``` 
 
-But I'm stuck in the `queue:work` for like few minutes and that means there's something error
+
+But I'm stuck in the `queue:work` for like few minutes and that means there's something error.
diff --git a/the-steps.md b/the-steps.md
@@ -140,4 +140,7 @@ mix.minTemplate('storage/framework/views/*.php', 'storage/framework/views/')
 
 ```
 $ npm run watch
-``` 
+$ php artisan queue:work 
+``` 
+
+But I'm stuck in the `queue:work` for like few minutes and that means there's something error
diff --git a/the-steps.md b/the-steps.md
@@ -101,3 +101,43 @@ appId: ca947070522dc618
 key: 1c63d178a9cdc73ac98359b7b976418a
 
 ```
+
+> this is what my webpack.mix.js 
+
+```js
+let mix = require('laravel-mix');
+require('laravel-mix-tailwind');
+
+/*
+|--------------------------------------------------------------------------
+| Mix Asset Management		
+|-------------------------------------	-------------------------------------
+|
+| Mix provides a clean, fluent API for defining some Webpack build steps
+| for your Laravel application. By default, we are compiling the Sass
+| file for the application as well as bundling up all the JS files.
+|
+*/
+
+mix.minTemplate = require('laravel-mix-template-minifier');
+// mix.js('resources/assets/js/scripts.js', 'public/js')
+mix.js('resources/assets/js/app.js', 'public/js')
+// .js('resources/assets/js/script.js','public/js')
+.sass('resources/assets/sass/app.scss', 'public/css')
+.tailwind()
+.browserSync("localhost:8004")
+
+
+if (mix.inProduction()) {
+
+mix.minTemplate('storage/framework/views/*.php', 'storage/framework/views/')
+
+}
+
+```
+
+- I open the terminal and ran
+
+```
+$ npm run watch
+``` 
diff --git a/the-steps.md b/the-steps.md
@@ -72,4 +72,32 @@ class MessageSent implements ShouldBroadcast
     }
 
 }
-```
+```
+
+> Then I issued this ..
+```
+composer require predis/predis
+yarn add --save socket.io-client laravel-echo
+yarn run dev
+```
+```
+yarn install -g laravel-echo-server
+```
+> then i issued
+```
+$ laravel-echo-server init
+? Do you want to run this server in development mode? Yes
+? Which port would you like to serve from? 6001
+? Which database would you like to use to store presence channel members? redis
+? Enter the host of your Laravel authentication server. http://blacktrail.test/
+? Will you be serving on http or https? http
+? Do you want to generate a client ID/Key for HTTP API? Yes
+? Do you want to setup cross domain access to the API? Yes
+? Specify the URI that may access the API: http://blacktrail.test:80
+? Enter the HTTP methods that are allowed for CORS: GET, POST
+? Enter the HTTP headers that are allowed for CORS: Origin, Content-Type, X-Auth-Token, X-Requested-Wi th, Accept, Authorization, X-CSRF-TOKEN, X-Socket-Id
+? What do you want this config to be saved as? laravel-echo-server.json
+appId: ca947070522dc618
+key: 1c63d178a9cdc73ac98359b7b976418a
+
+```
diff --git a/steps.md → the-steps.md b/steps.md → the-steps.md
diff --git a/gistfile1.txt → steps.md b/gistfile1.txt → steps.md
diff --git a/gistfile1.txt b/gistfile1.txt
@@ -0,0 +1,75 @@
+I am on version Laravel 5.5
+
+- I added this in the bottom part of the .env file 
+```
+MIX_APP_URL="${APP_URL}"
+```
+
+- I issued in the terminal 
+```
+php artisan config:cache
+```
+
+- I created an event with
+```
+ php artisan make:event MessageSent
+```
+
+> It would look like this 
+```php
+<?php	
+
+namespace App\Events;
+use Illuminate\Broadcasting\Channel;
+use Illuminate\Queue\SerializesModels;
+use Illuminate\Broadcasting\PrivateChannel;
+use Illuminate\Broadcasting\PresenceChannel;
+use Illuminate\Foundation\Events\Dispatchable;
+use Illuminate\Broadcasting\InteractsWithSockets;
+use Illuminate\Contracts\Broadcasting\ShouldBroadcast;
+
+class MessageSent implements ShouldBroadcast
+{
+    use Dispatchable, InteractsWithSockets, SerializesModels;
+
+    public $message ;
+
+     /**
+     * Create a new event instance.
+     *
+     * @return void
+     */
+     public function __construct(Message $message)
+     {
+        $this->message = $message; 
+        $this->dontBroadcastToCurrentUser();
+    }
+
+        /**
+     * Get the channels the event should broadcast on.
+     *
+     * @return \Illuminate\Broadcasting\Channel|array
+     */
+    public function broadcastOn()
+    {
+
+        /*we'll just use this for simpler coding..*/
+        return new PrivateChannel('message.'.$this->message->id);
+        // private channels .. -> needs user authenticated..
+        // return new PrivateChannel('channel-name');
+    }
+
+    public function broadcastAs()
+    {
+        return "New Event";
+    }
+
+    public function broadcastWith()
+    {
+        return [ 
+            'message' => $this->message
+        ];
+    }
+
+}
+```
No results found