آموزش ساخت اپلیکیشن تماس ویدیویی با جاوا اسکریپت، Supabase و WebRTC - آخرین آپدیت

دانلود Building Video Call App with Javascript, Supabase and WebRTC

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

آموزش ساخت اپلیکیشن تماس ویدیویی با جاوااسکریپت، WebRTC و Supabase

آیا به دنبال ساخت یک اپلیکیشن تماس ویدیویی مشابه Zoom یا WhatsApp هستید؟ این دوره جامع و پروژه محور، شما را در ساخت یک اپلیکیشن تماس ویدیویی بلادرنگ با استفاده از جاوااسکریپت، HTML، CSS، Socket IO، WebRTC و Supabase راهنمایی می‌کند.

این دوره فرصتی عالی برای تقویت مهارت‌های برنامه نویسی و بهبود دانش فنی شما در زمینه ارتباطات شبکه بلادرنگ است.

آنچه در این دوره خواهید آموخت:

  • مبانی WebRTC: شناخت موارد استفاده، محدودیت‌های فنی و ویژگی‌های اصلی WebRTC.
  • نحوه کار WebRTC در اپلیکیشن تماس ویدیویی: از گرفتن مدیا کاربر تا ایجاد اتصال همتا به همتا، تبادل فراداده، و استریم مدیا.
  • ویژگی‌های اپلیکیشن تماس ویدیویی: احراز هویت کاربر، ارتباط صوتی و تصویری بلادرنگ، سیستم تایید درخواست پیوستن توسط میزبان، و بی‌صدا کردن صدا و تصویر.
  • ساخت اپلیکیشن تماس ویدیویی با Socket IO و WebRTC: گام به گام از پیاده‌سازی Backend تا Frontend.
  • نصب و راه‌اندازی Express JS و Socket IO.
  • ایجاد سرور Socket و منطق پیوستن به اتاق.
  • ایجاد تبادل پیشنهاد و پاسخ SDP با استفاده از Socket IO.
  • راه‌اندازی فضای ذخیره‌سازی Supabase برای احراز هویت کاربر.
  • ساخت سیستم احراز هویت کاربر پایه.
  • ایجاد توابع برای ورود، ثبت نام و خروج.
  • ایجاد توابع برای شروع تماس ویدیویی و دسترسی به مدیا کاربر.
  • ایجاد تابع برای پیوستن به اتاق تماس ویدیویی و ساختار گردش کار تایید میزبان.
  • ایجاد اتصال همتا به همتا WebRTC و ارسال پیشنهاد SDP.
  • ایجاد توابع برای مدیریت پیشنهاد و پاسخ SDP.
  • ایجاد توابع برای تولید شناسه اتاق ملاقات، بی‌صدا کردن صدا و بی‌صدا کردن ویدیو.
  • طراحی داشبورد اپلیکیشن تماس ویدیویی.
  • طراحی صفحه ورود و ثبت نام.
  • طراحی رابط کاربری اپلیکیشن تماس ویدیویی با CSS.
  • انجام تست عملکرد و تست کارایی.

پیش‌نیازها:

  • عدم نیاز به تجربه قبلی در WebRTC.
  • دانش پایه در جاوااسکریپت و HTML.

چرا باید یک اپلیکیشن تماس ویدیویی با WebRTC بسازیم؟

این پروژه، درک شما را از ارتباطات بلادرنگ تقویت می‌کند و شما را در معرض فناوری‌های اصلی مورد استفاده پلتفرم‌هایی مانند Zoom، Google Meet و Microsoft Teams قرار می‌دهد. مهارت‌هایی که یاد می‌گیرید، مانند تنظیم اتصالات همتا به همتا، مدیریت سیگنالینگ و پیاده‌سازی احراز هویت امن کاربر، تنها به اپلیکیشن‌های تماس ویدیویی محدود نمی‌شوند. آنها را می‌توان در پروژه‌های دیگر از جمله سیستم‌های گفتگوی زنده، پلتفرم‌های پخش زنده و نرم‌افزارهای آموزش الکترونیکی نیز به کار برد. اینها مهارت‌های بسیار مورد تقاضا هستند که درها را به روی انواع مسیرهای شغلی در صنایع فناوری و رسانه باز می‌کنند.

توضیحات بیشتر:

پس از راه‌اندازی Backend، با استفاده از پروتکل‌های WebRTC، اتصال همتا به همتا را برقرار خواهیم کرد. این به کاربران این امکان را می‌دهد که مستقیماً و بدون تکیه بر یک سرور رسانه متمرکز، به هم متصل شده و با هم ارتباط برقرار کنند و از تاخیر کم و پخش با کیفیت بالا اطمینان حاصل شود. پس از آن، توابعی را ایجاد خواهیم کرد تا به کاربران امکان داده شود در حین تماس، جریان‌های صوتی و ویدیویی خود را بی‌صدا و از حالت بی‌صدا خارج کنند. این ویژگی به کاربران کنترل کامل بر ارتباطات و حریم خصوصی خود در طول جلسه می‌دهد. پس از آن، یک رابط تمیز و کاربرپسند با استفاده از HTML و CSS طراحی خواهیم کرد. این تضمین می‌کند که استفاده از برنامه آسان و از نظر بصری جذاب است. در نهایت، در پایان دوره، برنامه تماس ویدیویی را با استفاده از دو روش آزمایش، تست عملکرد و تست عملکرد آزمایش خواهیم کرد. با این کار، می‌توانیم اطمینان حاصل کنیم که برنامه به طور روان تحت شرایط مختلف اجرا می‌شود و تمام ویژگی‌ها به طور منظم کار می‌کنند.


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

مقدمه دوره Introduction to the Course

  • معرفی Introduction

  • فهرست مطالب Table of Contents

  • این دوره برای چه کسانی مناسب است؟ Whom This Course is Intended for?

ابزارها، IDE و پایگاه داده Tools, IDE, and Database

  • ابزارها، IDE و پایگاه داده Tools, IDE, and Database

مقدمه ای بر WebRTC Introduction to WebRTC

  • مقدمه ای بر WebRTC Introduction to WebRTC

WebRTC چگونه در اپلیکیشن تماس ویدیویی کار می کند؟ How WebRTC Works in Video Call App?

  • WebRTC چگونه در اپلیکیشن تماس ویدیویی کار می کند؟ How WebRTC Works in Video Call App?

ویژگی های اصلی اپلیکیشن تماس ویدیویی Video Call App Main Features

  • ویژگی های اصلی اپلیکیشن تماس ویدیویی Video Call App Main Features

ایجاد پوشه پروژه، نصب Express و Socket IO Creating Project Folder, Installing Express, and Socket IO

  • ایجاد پوشه پروژه، نصب Express و Socket IO Creating Project Folder, Installing Express, and Socket IO

ایجاد سرور Socket و منطق Join Room Creating Socket Server & Join Room Logic

  • ایجاد سرور Socket و منطق Join Room Creating Socket Server & Join Room Logic

ایجاد تبادل SDP Offer Answer با استفاده از Socket IO Creating SDP Offer Answer Exchange Using Socket IO

  • ایجاد تبادل SDP Offer Answer با استفاده از Socket IO Creating SDP Offer Answer Exchange Using Socket IO

راه اندازی Supabase Storage برای احراز هویت کاربر Setting Up Supabase Storage for User Authentication

  • راه اندازی Supabase Storage برای احراز هویت کاربر Setting Up Supabase Storage for User Authentication

ساخت سیستم احراز هویت کاربر پایه Building Basic User Authentication System

  • ساخت سیستم احراز هویت کاربر پایه Building Basic User Authentication System

ایجاد توابع برای ورود، ثبت نام و خروج Creating Functions for Login, Signup, and Logout

  • ایجاد توابع برای ورود، ثبت نام و خروج Creating Functions for Login, Signup, and Logout

ایجاد توابع برای شروع تماس ویدیویی و دسترسی به رسانه کاربر Creating Functions to Start Video Call & Access User Media

  • ایجاد توابع برای شروع تماس ویدیویی و دسترسی به رسانه کاربر Creating Functions to Start Video Call & Access User Media

ایجاد توابع برای پیوستن به اتاق تماس ویدیویی و ساختاربندی جریان تایید میزبان Creating Functions for Joining Video Call Room & Structuring Host Approval Flow

  • ایجاد توابع برای پیوستن به اتاق تماس ویدیویی و ساختاربندی جریان تایید میزبان Creating Functions for Joining Video Call Room & Structuring Host Approval Flow

ایجاد اتصال WebRTC Peer و ارسال SDP Offer Creating WebRTC Peer Connection & Sending SDP Offer

  • ایجاد اتصال WebRTC Peer و ارسال SDP Offer Creating WebRTC Peer Connection & Sending SDP Offer

ایجاد توابع برای مدیریت SDP Offer & Answer Creating Functions to Handle SDP Offer & Answer

  • ایجاد توابع برای مدیریت SDP Offer & Answer Creating Functions to Handle SDP Offer & Answer

ایجاد توابع برای تولید شناسه اتاق جلسه، قطع صدا و قطع تصویر Creating Functions to Generate Meeting Room ID, Mute Audio, and Mute Video

  • ایجاد توابع برای تولید شناسه اتاق جلسه، قطع صدا و قطع تصویر Creating Functions to Generate Meeting Room ID, Mute Audio, and Mute Video

طراحی داشبورد اپلیکیشن تماس ویدیویی Designing Video Call App Dashboard

  • طراحی داشبورد اپلیکیشن تماس ویدیویی Designing Video Call App Dashboard

طراحی صفحه ورود و ثبت نام Designing Login & Signup Page

  • طراحی صفحه ورود و ثبت نام Designing Login & Signup Page

استایل دهی به رابط کاربری اپلیکیشن تماس ویدیویی با CSS Styling Video Call App User Interface with CSS

  • استایل دهی به رابط کاربری اپلیکیشن تماس ویدیویی با CSS Styling Video Call App User Interface with CSS

تست اپلیکیشن تماس ویدیویی Testing Video Call App

  • تست اپلیکیشن تماس ویدیویی Testing Video Call App

نتیجه گیری و خلاصه Conclusion & Summary

  • نتیجه گیری و خلاصه Conclusion & Summary

نمایش نظرات

آموزش ساخت اپلیکیشن تماس ویدیویی با جاوا اسکریپت، Supabase و WebRTC
جزییات دوره
5 hours
23
Udemy (یودمی) Udemy (یودمی)
(آخرین آپدیت)
2,803
4.7 از 5
دارد
دارد
دارد
جهت دریافت آخرین اخبار و آپدیت ها در کانال تلگرام عضو شوید.

Google Chrome Browser

Internet Download Manager

Pot Player

Winrar

Christ Raharja Christ Raharja

مشاور سابق ریسک فناوری و علاقه‌مند به تجارت الکترونیک