https://github.com/igor-ad/laravel-live-chat

Laravel 11 Live Chat, React SPA with Pusher.
https://github.com/igor-ad/laravel-live-chat

chat chatroom laravel livechat php pusher react reweb spa websockets

Last synced: 3 months ago
JSON representation

Laravel 11 Live Chat, React SPA with Pusher.

• Host: GitHub
• URL: https://github.com/igor-ad/laravel-live-chat
• Owner: Igor-ad
• Created: 2024-04-16T08:56:54.000Z (10 months ago)
• Default Branch: main
• Last Pushed: 2024-11-07T19:07:58.000Z (3 months ago)
• Last Synced: 2024-11-07T20:20:13.048Z (3 months ago)
• Topics: chat, chatroom, laravel, livechat, php, pusher, react, reweb, spa, websockets
• Language: PHP
• Homepage:
• Size: 921 KB
• Stars: 1
• Watchers: 1
• Forks: 1
• Open Issues: 1
• Metadata Files:
  • Readme: README.md

Awesome Lists containing this project

README

        


## Laravel 11 Live Chat, React SPA with Pusher.

The system must first have the necessary components installed: composer, git, docker. PHP version ^8.2  

Commands init application:

```

> cd /path_to_projects

> git clone https://github.com/Igor-ad/laravel-live-chat.git

> cd ./laravel-live-chat

> cp ./.env.example ./.env

```

It is necessary to fill in the parameters of the environment file ./.env with the following values:

DB_PASSWORD,

PUSHER_APP_ID,

PUSHER_APP_KEY,

PUSHER_APP_SECRET,

```

> composer install

> ./vendor/bin/sail up

> chmod 777 -R ./storage/logs

> chmod 777 ./storage/framework/views

> php artisan key:generate

> php artisan migrate

> npm install 

> npm run build

> php artisan queue:listen

```

#### Main features of Laravel-live-chat:

1. Create a public/private chat;       

2. Soft deletion of your own chats;

3. Ability to choose your own or public chat;

4. Sending and soft deleting your own chat messages;

5. Smooth scrolling of the message feed when receiving a new message in the chat;

6. Sending a pop-up message with an invitation to a public/private chat for the user on any page of the site;

7. Collapse/expand the panel with users authorized in to the site;

8. Chat status bar, which displays chat events;

9. Standard profile page for changing user registration data (Breeze);

10. Standard check of the user mailbox during registration;

11. CSRF protection of post/delete requests.

#### Functions for displaying events in the chat status bar:

1. Number of online users in the current chat;

2. User login/logout from the site;

3. User entry/exit from the current chat;

4. Typing the message text by the user;

5. Erasing the message text by the user;

6. Display the text of a message deleted by the user;

7. Creation/deletion of a chat by the user;

8. Clear status bar after 10 seconds.

##### Examples of web pages

![image](public/img/chat_list.png)

![image](public/img/create_chat.png)

![image](public/img/chat_box.png)

![image](public/img/invite_modal.png)

![image](public/img/admin_chat_box.png)

![image](public/img/deleting_message_chat_box.png)

The application has also been successfully tested with the latest version of Laravel Reverb as a WebSockets server.

The settings in the .env and echo.js files need to be changed to match the Reverb server.

You also need to install dependencies to work with the Reverb server.