آموزش یک Google Meet Clone از ابتدا بسازید: WebRTC & Socket io

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

خوش آمدی Welcome

• خوش آمدی Welcome

کد منبع پروژه را با منابع کامل کنید Complete Project Source Code with Resources

• بیا شروع کنیم Let's Start

• کد منبع پروژه را با منابع کامل کنید Complete Project Source Code with Resources

طراحی و عملکرد صفحه فرود Landing Page Design and Functionality

• منبع بخش Section Resource

• ایجاد ساختار پوشه و راه اندازی محیط پروژه Create folder structure and setup project environment

• طراحی صفحه فرود – قسمت 1 Design landing page – part 1

• صفحه فرود طراحی – قسمت 2 Design Landing Page – Part 2

• ایجاد عملکرد صفحه فرود Create Landing Page Functionlity

طراحی صفحه اصلی Home Page Design

• صفحه اصلی طراحی – قسمت 1 Design Home Page – Part 1

• صفحه اصلی طراحی – قسمت 2 Design Home Page – Part 2

• CSS را در صفحه اصلی اعمال کنید Apply CSS to Home Page

راه اندازی سرور و Socket.io Server and Socket.io Setup

• راه اندازی پایه جاوا اسکریپت Basic Javascript Setup

• راه اندازی سرور اکسپرس Express Server Setup

• سوکت را در سایت مشتری راه اندازی کنید Setup Socket at Client Site

پخش ویدیوی صوتی گروهی Group Audio Video Streaming

• به سایر کاربران در مورد من اطلاع دهید Let other users know about me

• کاربران را اضافه کنید و اتصال را تنظیم کنید Add users and set connection

• فرآیند پیشنهاد را تنظیم کنید Set Offer Process

• تکمیل تابع setconnection Completion of setconnection Function

• تکمیل عملکرد فرآیند sdp Completion of sdp process function

• در مورد سایر کاربران به من اطلاع دهید Inform me about other users

• ایجاد گزینه برای پخش ویدیوی صوتی Creating option for audio video stream

• فرآیند ویدیویی Video process

• تست برنامه پایه Testing basic app

• راه اندازی UpdateMediaSenders Setup UpdateMediaSenders

• پخش جریانی را حذف کنید، صدا را پردازش کنید و مشکلات را برطرف کنید Remove stream, process audio and fix issues

سیستم به اشتراک گذاری صفحه نمایش Screen Sharing System

• ایجاد سیستم اشتراک گذاری صفحه نمایش Create Screen Sharing System

• کاربران را قطع کنید Disconnect users

ایجاد سیستم پیام رسانی Create Messaging System

• طراحی رابط پیام Designing message interface

• ایجاد سیستم پیام رسانی - قسمت 1 Creating messaging system – Part 1

• ایجاد سیستم پیام رسانی - قسمت 2 Creating messaging system-Part 2

ایجاد جزئیات شرکت کننده Create Participant Details

• نمایش شرکت کننده - قسمت 1 Participant show – Part 1

• نمایش شرکت کننده - قسمت 2 Participant Show – Part 2

کارکردهای متفرقه Miscellaneous Functionality

• ایجاد عملکرد جلسه مرخصی Creating leave meeting functionlity

• ایجاد جزئیات جلسه Creating Meeting Details

• درخواست نمایش تمام صفحه Request Full Screen

• افزودن قابلیت های متفرقه Add Miscellaneous Functionality

ایجاد سیستم اشتراک گذاری فایل Create File Sharing System

• سیستم به اشتراک گذاری فایل - قسمت 1 File Sharing System – Part 1

• سیستم اشتراک فایل قسمت 2 File sharing system part 2

سیستم ضبط جلسات Meeting Recording System

• طراحی دکمه های ضبط Designing Record Buttons

• ایجاد سیستم ضبط Create Recording System

واژه نامه WebRTC WebRTC Glossary

• MediaStream MediaStream

• اتصال RTCPeer RTCPeerConnection

• کانال داده Data Channel

• TCP UDP TCP UDP

• یخ ICE

• SDP SDP

• STUN STUN

• دور زدن TURN

• DTLS DTLS

• SRTP SRTP

• SCTP SCTP

• TLS TLS

• HTTP و HTTPS HTTP & HTTPS

• SSE SSE

• سوکت وب Websocket

• XHR XHR

ویژه: آپلود پروژه در سرور زنده Featured: Upload Project in Live Server

• در سرور زنده آپلود کنید Upload in Live Server

ویژگی ها: عملکرد بالا بردن دست Featured: Hand Raise Functionality

• طراحی دست بالا بردن گزینه Design Hand Raise Option

• ایجاد قابلیت بالا بردن دست Creating Hand Raise Functionality

نتیجه Conclusion

• تبریک میگم Congratulation