WebRTC Practical Course. Create Video Chat Application

WebRTC Practical Course. Create Video Chat Application, available at $74.99, has an average rating of 4.5, with 82 lectures, based on 343 reviews, and has 3374 subscribers.

You will learn about WebRTC Working with media streams Creating peer to peer connection Create socketIO server Creating video chat application Real-time communication Working with JavaScript and html to manage UI Video Chat WebRTC implementation Build front-end with vanilla JavaScript WebRTC data channels Stream recording This course is ideal for individuals who are Students and programmers who want to learn WebRTC by creating an application It is particularly useful for Students and programmers who want to learn WebRTC by creating an application.

Enroll now: WebRTC Practical Course. Create Video Chat Application

Summary

Title: WebRTC Practical Course. Create Video Chat Application

Price: $74.99

Average Rating: 4.5

Number of Lectures: 82

Number of Published Lectures: 82

Number of Curriculum Items: 82

Number of Published Curriculum Objects: 82

Original Price: $124.99

Quality Status: approved

Status: Live

What You Will Learn

WebRTC

Working with media streams

Creating peer to peer connection

Create socketIO server

Creating video chat application

Real-time communication

Working with JavaScript and html to manage UI

Video Chat

WebRTC implementation

Build front-end with vanilla JavaScript

WebRTC data channels

Stream recording

Who Should Attend

Students and programmers who want to learn WebRTC by creating an application

Target Audiences

Students and programmers who want to learn WebRTC by creating an application

Learn WebRTC by creating project with vanilla JavaScript. Only basic JavaScript knowledge is required.  We will go through all of the steps to create application with direct calls where you can establish connection between two users by passing his personal code or you can just connect with the stranger like in omegle or talkwithstranger web apps. We will write own WebRTC implementation to show how easily you can develop WebRTC application.  We will not use any framework  for our front-end so you do not need to have any experience with frameworks(React, Vue.js, Angular). We will use also SocketIO as our signaling server for our application. After this course you will be able to create own application which will be using WebRTC. It does not matter if that will be the realtime communication game or video chat. You will know the process how to establish connection between two peers.

In our application we will use:

WebRTC

JavaScript

SocketIO

Express.js

Node.js

Vanilla JavaScript to create front-end of our application

We will focus on things related with WebRTC. Also you will get a knowledge how you can use SocketIO as your websocket server.

App creating proccess:

Prepare environment

Build frontend of our application with vanilla JavaScript

Connect with SocketIO

Add our own WebRTC implementation for calls

Add WebRTC data channels for chat functionality

Add recording possibility

Add possibility to connect with the strangers

I hope you will enjoy the course and after finishing it you will feel confident to start preparing and adjusting your own WebRTC implementation.

Course Curriculum

Chapter 1: App presentation and theory

Lecture 1: Course preview

Lecture 2: Technology stack and introduction

Lecture 3: App preview – direct video calls

Lecture 4: App preview – messenger

Lecture 5: App preview – Strangers

Lecture 6: Theory – What is WebRTC ?

Lecture 7: Theory – What is signaling server ?

Lecture 8: Theory – What is STUN server ?

Lecture 9: Theory – What is TURN server ?

Lecture 10: Theory – What is SDP ?

Lecture 11: Theory – What are ICE candidates ?

Lecture 12: Theory – How to establish direct connection between peers

Chapter 2: Prepare environment and create server

Lecture 1: Server initialization

Lecture 2: Adding nodemon to watch the changes

Lecture 3: Connecting our server with Socket.IO

Lecture 4: Connecting to Socket.IO from client side

Lecture 5: Storing array of connected users in our server

Chapter 3: Creating front-end of our application

Lecture 1: Importing files to our project and creating main preview

Lecture 2: Creating personal code container

Lecture 3: Creating input for personal code and connection buttons

Lecture 4: Creating buttons for stranger connection

Lecture 5: Adding checkbox for stranger connections

Lecture 6: Dashboard styling fix and dashboard blocker added

Lecture 7: Creating call container placeholder and remote video

Lecture 8: Adding local video preview

Lecture 9: Creating conversation buttons

Lecture 10: Creating end chat connection button

Lecture 11: Creating recording buttons and panel

Lecture 12: Adding new message input with button

Chapter 4: Preparing logic of the application before WebRTC connection

Lecture 1: State management – adding our custom store

Lecture 2: Updating personal code

Lecture 3: Coping button functionality

Lecture 4: Code preparation to send pre-offer

Lecture 5: Sending pre-offer to server

Lecture 6: Sending pre-offer to callee

Lecture 7: Fixing pre-offer bug

Lecture 8: Handling pre-offer

Lecture 9: Creating incoming call dialog

Lecture 10: Showing calling dialog only when pre offer will come

Lecture 11: Solving problem with no request coming

Lecture 12: Creating calling dialog at caller side

Lecture 13: Sending pre-offer answer to caller

Lecture 14: Handling pre-offer answer

Lecture 15: Showing response dialog if call is not possible

Lecture 16: Showing call elements related with call type

Lecture 17: Setting correct position of remote video element

Chapter 5: WebRTC implementation to establish connection between two users

Lecture 1: Getting an access to camera and microphone and showing that in local preview

Lecture 2: Creating peer connection

Lecture 3: Sending WebRTC offer

Lecture 4: Testing WebRTC offer

Lecture 5: Handling WebRTC offer. Preparing WebRTC answer and handling it at caller side

Lecture 6: Exchanging ICE candidates and adding them to peer connection

Lecture 7: Adding functionality to mute and unmute and turn on/off camera

Lecture 8: Screen sharing functionality

Lecture 9: Switching back to camera

Chapter 6: WebRTC data channels

Lecture 1: Creating data channel and configuring peer connection

Lecture 2: Sending messages using data channel

Lecture 3: Displaying messages

Chapter 7: MediaRecorder API

Lecture 1: Creating recording utils

Lecture 2: Connecting recording utils with buttons

Lecture 3: Pausing and resuming recording

Chapter 8: Finishing app by adding possibility to connect with the strangers and hanging up

Lecture 1: Preparing for hang up possibilty

Lecture 2: Hanging up with connected user

Lecture 3: Finishing chat connection

Lecture 4: Preparing call states

Lecture 5: Finishing call states

Lecture 6: Fixing call state bug

Lecture 7: adding hang up possibility to calling dialog

Lecture 8: Allow connections from strangers checkbox

Lecture 9: Storing list of the users which allow connections from strangers at server

Lecture 10: Getting socket id of random user from server

Lecture 11: Fixing bug when trying to get random socket id from server

Lecture 12: Connecting with Stranger

Lecture 13: Showing UI depends of the stranger call type

Lecture 14: Adding information if no Strangers are available

Chapter 9: App deployment to heroku

Lecture 1: Heroku – deploying app

Chapter 10: Connecting with TURN server and checking connection outside of local network

Lecture 1: Getting TURN server credentials from Twilio

Lecture 2: Fetching TURN server credentials from client side

Lecture 3: Checking if TURN credentials are successfully fetched

Lecture 4: Deploying application connected to TURN server

Lecture 5: Testing connection with user connected to different network

Chapter 11: Whats next

Lecture 1: Whats next

Instructors

Marek Gryszkiewicz
Web Developer

Rating Distribution

1 stars: 5 votes

2 stars: 8 votes

3 stars: 33 votes

4 stars: 100 votes

5 stars: 198 votes

Frequently Asked Questions

How long do I have access to the course materials?

You can view and review the lecture materials indefinitely, like an on-demand channel.

Can I take my courses with me wherever I go?

Definitely! If you have an internet connection, courses on Udemy are available on any device at any time. If you don’t have an internet connection, some instructors also let their students download course lectures. That’s up to the instructor though, so make sure you get on their good side!