Realtime Chat with Laravel-Livewire: Tall App from Scratch

سرفصل های دوره

Master real-time chat apps with Laravel, Livewire, Tailwind, and Alpine.js for seamless interactivity

1. Introduction

1. Create new Laravel application

2. Install Breeze

3.1 Github Repository.html

3. Install Livewire

2. ChatList Component Design

1.1 Github Repository.html

1.2 index.blade.zip

1.3 web.zip

1. Create Index

2.1 avatar.blade.zip

2. Create x-avatar component

3. Chat list header

4.1 chat-list.blade.zip

4. Chatlist Item

3. ChatBox Component Design

1.1 chat-box.blade.zip

1. Chat.Chat

2. ChatBox

3. Chatbox Header

4. Chatbox messages

5.1 chat-box.blade.zip

5. Chatbox Footer

4. Create Models and Migrations

1.1 2023 06 03 073254 create conversations table.zip

1. Conversation table

2.1 2023 06 03 073305 create messages table.zip

2. Messages Table

5. Design Relationships, scopes and methods

1.1 conversation.zip

1. Conversation Relationship

2.1 message.zip

2. Message Relationship

3.1 user.zip

3. User Relationship

6. Create userlist and conversation

1.1 users.blade.zip

1.2 users.zip

1.3 web.zip

1. Create Users list

2. Create Conversation

7. Get conversation from query parameter

1. Load SelectedConversation in Main Chat

8. Get All Conversations

1.1 chat-list.blade.zip

1.2 chatlist.zip

1. Load All Conversations

2. Scroll to SelectedChat

9. Sending message & Load Messages

1. Make Selected Conversation nullable & Get Receiver

2. Send and save message to database

3. Load messages

4. Message read Status

5. Push message to Chatbox

6. Show Message time

7.1 chat-box.blade.zip

7.2 chatbox.zip

7. Scroll Chat to bottom

8. Hide Avatar of Auth Message

9. Update conversation updated at when new message sent

10.1 chat-box.blade.zip

10.2 chatbox.zip

10. Emit event to Chatlist

10. Mark Messages As Read

1.1 chat.zip

1. Mark Messages in Main Chat

11. Refresh Chatlist ,Get Unread Messages Count

1. Listen to emitted event in Chatlist

2. Get Unread messages count

3.1 chat-list.blade.zip

3.2 chatlist.zip

3.3 conversation.zip

3. Chatlist Message Read Status

12. Load More Messages

1. Load more messages

2.1 chat-box.blade.zip

2.2 chatbox.zip

2. Update Chat Scroll Position

13. Broadcasting

1. Install Pusher SDK & Laravel Echo

2.1 chatbox.zip

2.2 messagesent.zip

2. MessageSent Notification

3.1 chatbox.zip

3. Listen MessageSent Notification

4. Add Queued Jobs

5.1 chat-box.blade.zip

5.2 chat-list.blade.zip

5.3 chatbox.zip

5.4 messageread.zip

5. MessageRead Notification

6. Mark message AsRead using Alpine.js in Chatbox

7. Update Chatlist After message is broadcasted

14. Deleting Conversations

1.1 2023 06 04 084141 create messages table.zip

1.2 chat-list.blade.zip

1.3 chatlist.zip

1. Delete Conversation By User Method

2.1 conversation.zip

2.2 user.zip

2. Filter Deleted Conversations

3.1 chatbox.zip

3.2 Github Repository.html

3. Filter Deleted Messages

179,000 تومان

افزودن به سبد خرید

خرید دانلودی فوری

در این روش نیاز به افزودن محصول به سبد خرید و تکمیل اطلاعات نیست و شما پس از وارد کردن ایمیل خود و طی کردن مراحل پرداخت لینک های دریافت محصولات را در ایمیل خود دریافت خواهید کرد.

تولید کننده: Udemy-Training