Course Outline
Managing Media Devices
1. Browser Permissions with navigator.permissions
- Accessing hardware:
- Webcam
- Microphone
- Optional permissions:
- Geolocation
- Notifications
- Clipboard (read/write)
- Querying permissions and checking status
- Limitations and browser compatibility considerations
2. Reading Media Devices with navigator.mediaDevices
- Enumerating devices
- Managing device changes
3. Cross-browser Compatibility
- API utilization:
- navigator.permissions.query()
- navigator.mediaDevices.enumerateDevices()
- getUserMedia()
- Strategies for Safari fallback
4. Media Device Handling
- Device initialization: getUserMedia(constraints)
- Configuring media device constraints
- Starting and stopping media streams
- Managing device changes
5. Recording Devices with MediaRecorder
- Initiating and halting streaming and recording
- Downloading .webm files
- Previewing real-time waveforms
Optional Enhancements:
- Exporting to .wav format via ScriptProcessorNode
- Visualizing audio FFT spectrum
- Displaying volume levels in decibels
- Integrating voice recognition using webkitSpeechRecognition
Peer Connection
1. Signaling Servers
- Options for bidirectional communication:
- WebSocket
- Socket.io
- SignalR
- Structure of messages
- Building a simplified WebRTC client
- Executing a complete signaling flow
2. Video Chat via WebRTC
- Architecture: Node.js combined with ws
- WebRTC client implementation using RTCPeerConnection
- Conducting local end-to-end testing
Optional Features:
- Implementing call hang-up functionality (closing connections, stopping media)
- Enabling group calling within multi-user rooms
- Incorporating token-based authentication
3. Screen Sharing
- Leveraging getDisplayMedia()
- Architectural design and available options
4. Session Description Protocol (SDP)
- Overview and structure of SDP
- Reading and interpreting SDP data
- Codec management:
- Audio & Video codecs
- Negotiation and control mechanisms
- Fallback strategies
5. WebRTC Statistics with getStats()
- Types of available statistics
- Interpreting statistical data
- Creating charts for live bitrate and jitter
- Strategies for quality adaptation
6. All topics are covered through
- Hands-on use-cases
Requirements
This course is particularly suited for frontend and full-stack developers, technical architects, and engineers developing real-time communication features for browsers, such as video chat, screen sharing, or audio streaming. Participants should possess a solid understanding of JavaScript and web technologies, with optional familiarity in Node.js and WebSocket-based communication being beneficial.
Testimonials (3)
I really enjoyed learning about AI attacks and the tools out there to begin practicing and actively using for security testing. I took a lot of knowledge away which I didn't have at the beginning and the course met what I hoped it would be. My favorite part shown from the training was Comet Browser and was amazed at what it could do. Definitely something will be looking into more. Overall it was a great course and enjoyed learning all OWASP GenAI Top 10.
Patrick Collins - Optum
Course - OWASP GenAI Security
Hands-on, exercises, in-person helping and questioning.
Jose Paulos - INESC TEC
Course - Tailwind CSS
That every technical lesson came with multiple practical exercises to nail down the concepts.
