Course Outline
Handling Media Devices
1. Managing Browser Permissions via navigator.permissions
- Accessing hardware components:
- Webcam
- Microphone
- Optional permissions:
- Geolocation
- Notifications
- Clipboard (read/write access)
- Querying permission status
- BROWSER compatibility and limitations
2. Accessing Media Devices using navigator.mediaDevices
- Enumerating available devices
- Managing device changes
3. Ensuring Cross-browser Compatibility
- Utilizing APIs:
- navigator.permissions.query()
- navigator.mediaDevices.enumerateDevices()
- getUserMedia()
- Strategies for Safari fallback
4. Media Device Management
- Initializing devices: getUserMedia(constraints)
- Configuring media device constraints
- Starting and stopping media streams
- Handling device changes
5. Recording via MediaRecorder
- Controlling streaming and recording start/stop
- Downloading recordings in .webm format
- Real-time waveform visualization
Optional Enhancements:
- Saving files in .wav format using ScriptProcessorNode
- Visualizing audio FFT spectrum
- Displaying volume levels in decibels
- Integrating voice recognition via webkitSpeechRecognition
Peer Connection Management
1. Configuring Signaling Servers
- Evaluating bidirectional channel options:
- WebSocket
- Socket.io
- SignalR
- Structuring messages
- Implementing a simplified WebRTC client
- Executing a complete signaling flow
2. Implementing Video Chat via WebRTC
- Architecture: Node.js combined with ws
- WebRTC client: RTCPeerConnection
- Conducting local End-to-End (E2E) testing
Optional Capabilities:
- Implementing call termination (closing connections and halting media)
- Facilitating group calls (multi-user environments)
- Applying token-based authentication
3. Screen Sharing Implementation
- Utilizing getDisplayMedia()
- Architectural designs and available options
4. Understanding the Session Description Protocol (SDP)
- Overview and SDP content structure
- Techniques for reading and interpreting SDP
- Codec management:
- Audio & Video codecs
- Negotiation and control mechanisms
- Implementing fallback strategies
5. Analyzing WebRTC Statistics via getStats()
- Types of statistical data available
- Methods for interpreting statistics
- Generating live bitrate and jitter charts
- Strategies for quality adaptation
6. Comprehensive Topic Coverage
- Hands-on practical use cases
Requirements
This course is designed for frontend and full-stack developers, technical architects, and engineers who are creating browser-based real-time communication features such as video chat, screen sharing, or audio streaming. Participants are expected to possess a solid understanding of JavaScript and web technologies, with optional prior experience 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.