Главная страницаКатегория react.js React и WebRTC 2023 & Приложение для обмена местоположения с видеочатом

React и WebRTC 2023 & Приложение для обмена местоположения с видеочатом

Name: React и WebRTC 2023 & Приложение для обмена местоположения с видеочатом
Price: 13 USD
Rating: 3.3 (3 reviews)

React and WebRTC 2023 & Sharing Location App with Video Chat

udemy

★3.3 (всего оценок - 3)

React и WebRTC 2023 & Приложение для обмена местоположения с видеочатом

Начать Сейчас

Продолжительность

8 ч 11 мин

Категория

React.js

Количество уроков

86 Видео

Дата добавления

10 мая 2023 г., 14:31

Язык

Английский

Дата выхода

23 февр. 2023 г., 01:00

Изучите технологии, такие как React, WebRTC (PeerJS), SocketIO и Google Maps API, создав потрясающий проект "GeoCall". В этом практическом курсе мы сразу перейдем к коду и объясним все необходимые вещи на протяжении всего курса. Мы пройдем через все шаги создания приложения с возможностью поделиться нашим местоположением на карте с другими пользователями. Мы создадим собственную реализацию PeerJS, чтобы показать, как вы можете разрабатывать приложение WebRTC с прямыми вызовами.

После этого курса вы сможете создавать свое собственное приложение с Google Maps и функцией звонков. Вы узнаете процесс установки соединения между пирами.

В нашем приложении мы будем использовать:

WebRTC (PeerJS)
JavaScript
SocketIO
Express.js
Node.js
React
Google Maps API

Мы создадим необходимый пользовательский интерфейс с помощью React и Google Maps, а затем продолжим со всей логикой, связанной с SocketIO и WebRTC.

Процесс создания приложения:

Подготовить среду
Создать интерфейс нашего приложения с помощью React
Связать наше приложение с Google Maps
Создать функциональность чата с помощью SocketIO
Создать функциональность обмена нашим местоположением с другими пользователями
Соединить собственный сервер PeerJS
Реализовать прямые вызовы с помощью PeerJS

Я надеюсь, что вам понравится курс, и после его завершения вы будете уверены в своей способности создавать свое собственное приложение с Google Maps и функцией чата с прямыми вызовами.

Также вы можете найти модуль теории о WebRTC, если хотите узнать больше деталей о реализации PeerJS.

Посмотреть больше

Это пробный урок. Оформите подписку, чтобы получить доступ ко всем материалам курса. Премиум

Урок 1. 00:03:19
Application Preview
Урок 2. 00:02:15
Node.js installation
Урок 3. 00:02:23
Creating Server Project
Урок 4. 00:06:53
Creating Express Server
Урок 5. 00:05:37
Adding Socket.IO Server
Урок 6. 00:02:56
Testing Connection with Postman
Урок 7. 00:04:31
Disconnected Event Handler
Урок 8. 00:01:00
More about Events Handlers
Урок 9. 00:04:12
Creating React Application
Урок 10. 00:08:21
Connecting with Redux State Management
Урок 11. 00:05:39
Routing with react-router-dom
Урок 12. 00:07:26
Creating Login Page View
Урок 13. 00:04:02
Handling Username Input
Урок 14. 00:06:26
Handling Login Button
Урок 15. 00:03:48
Code Refactoring
Урок 16. 00:07:23
Getting Geo Location
Урок 17. 00:01:52
Disabling Button on Location Error
Урок 18. 00:03:47
Saving Location In Store
Урок 19. 00:05:07
Redux Store Debugging
Урок 20. 00:05:52
Getting Fake Location
Урок 21. 00:09:45
Connection with Socket.IO Server
Урок 22. 00:07:27
Storing Online Users
Урок 23. 00:08:33
Login functionality
Урок 24. 00:11:38
Emitting Event with Online Users
Урок 25. 00:07:46
Saving Online Users In Store
Урок 26. 00:06:11
Removing Disconnected User From Store
Урок 27. 00:03:30
Testing Functionality Of Removing Disconnected User
Урок 28. 00:08:25
Rendering Google Map
Урок 29. 00:13:06
Rendering Map Markers
Урок 30. 00:02:30
Rendering Username Label
Урок 31. 00:04:34
Creating User Card
Урок 32. 00:06:49
Connecting User Info Card
Урок 33. 00:05:21
Calculating Distance Between Two Coordinates
Урок 34. 00:04:20
Converting Number to Two Decimals
Урок 35. 00:05:05
Creating Chat Button
Урок 36. 00:07:03
Preparing Store For Messages
Урок 37. 00:06:47
Creating Dummy Chatboxes
Урок 38. 00:06:19
Adding Nav Bar to Chatbox
Урок 39. 00:01:45
Adding Messages Container
Урок 40. 00:02:06
Adding New Message Input
Урок 41. 00:05:27
Handling User Input
Урок 42. 00:06:31
Rendering Dummy Messages
Урок 43. 00:06:19
Displaying Real Chatboxes
Урок 44. 00:03:22
Closing Chatboxes
Урок 45. 00:18:29
Appending Local Messages
Урок 46. 00:02:56
Fixing Bug With Messages
Урок 47. 00:09:45
Sending Messages To Other Users
Урок 48. 00:04:28
Displaying Messages At Server Side
Урок 49. 00:04:50
Automatically Opening Chatboxes
Урок 50. 00:04:02
Messages Scroll Automatically
Урок 51. 00:00:55
Introduction To Video Rooms
Урок 52. 00:05:23
Preparing Store For Video Rooms
Урок 53. 00:07:03
Create Room Button
Урок 54. 00:07:02
Creating Join Room Buttons
Урок 55. 00:10:48
Informing Server About New Room Created
Урок 56. 00:02:27
Fixing Bug With Emitting Event With New Room
Урок 57. 00:06:17
Broadcasting Rooms List to All Users
Урок 58. 00:03:28
Setting Real Rooms In Store
Урок 59. 00:04:48
Rendering Real Rooms
Урок 60. 00:13:57
Getting Access To Local Stream
Урок 61. 00:08:38
Displaying Local Video
Урок 62. 00:04:03
PeerJS Introduction
Урок 63. 00:04:31
Creating Peer Object
Урок 64. 00:08:11
How Peer Server Works
Урок 65. 00:08:18
Connecting With Peer Server
Урок 66. 00:07:51
Preparing Peer Implementation For Calling
Урок 67. 00:11:00
Joining Video Room
Урок 68. 00:09:17
Updating Rooms At Server Side
Урок 69. 00:01:08
Testing Broadcasting Rooms After Login Event
Урок 70. 00:03:36
Connecting (Calling) With Second User
Урок 71. 00:04:03
Displaying Remote Stream
Урок 72. 00:06:37
Creating Video Room Buttons
Урок 73. 00:05:10
Leaving Room At Initiator Side
Урок 74. 00:01:39
Testing Leaving Room
Урок 75. 00:07:36
Server Side Logic Of Leaving Room
Урок 76. 00:11:17
Closing Peer Connection At Both Sides
Урок 77. 00:12:28
Handling Case Of ,,Dirty Leave"
Урок 78. 00:10:19
Microphone and Camera Buttons
Урок 79. 00:03:19
Muting And Switching Camera Off
Урок 80. 00:01:39
What is WebRTC ?
Урок 81. 00:01:17
What is Signaling Server ?
Урок 82. 00:01:11
What is STUN Server ?
Урок 83. 00:02:07
What is TURN Server ?
Урок 84. 00:01:37
What is SDP ?
Урок 85. 00:01:44
What are ICE Candidates ?
Урок 86. 00:03:12
How To Establish Direct Connection Between Peers

Автор - udemy

udemy

Udemy - одна из самых больших площадок в мире по доставке обучающего контента от разных авторов всего мира. Присутсвуют курсы практически на любую тему.

+194