The case study of building Slack with Laravel and Vue.js.
You can read the full write up here:
- Overview
- Backend (coming soon)
- Frontend (coming soon)
If you wanna host it on your own to see how it works, just follow the instructions.
Be warned though, I'm writing the instructions at 2 in the morning, things might will go wrong.
Create a Pusher account.
Make sure your .env
variables are all set. Keep track of that cluster!
PUSHER_APP_ID=
PUSHER_APP_KEY=
PUSHER_APP_SECRET=
PUSHER_CLUSTER=
Also, change your pusher settings in resources/assets/js/bootstrap.js
. I committed mine but, ¯_(ツ)_/¯, add your key and cluster right there too.
Vue.prototype.$echo = window.echo = new Holler({
broadcaster: 'pusher',
key: '',
cluster: '',
});
I didn't really make a registration form for creating teams (sorry for that), so you'll either have to use php artisan tinker
, or modify database/seeds/TeamsTableSeeder.php
and add your preferred subdomain to make things work.
Don't forget to run composer.
$ composer install
Also, we'll have to migrate the database, seed it, and set up Passport's defaults.
$ php artisan:fresh --seed && art passport:install
I'm running the app via Laravel Valet.
To link to the subdomains you'll be testing out, go to the project root and run valet link <subdomain>.slack.dev
.
You should be able to access the registration form from there.
I don't think there'll be anything special here other than running yarn. I think.
$ yarn
$ yarn run dev