문의를 보내주셔서 감사합니다! 팀원이 곧 연락드리겠습니다.
예약을 보내주셔서 감사합니다! 저희 팀 멤버 중 한 분이 곧 연락드리겠습니다.
코스 개요
미디어 장치 처리
1. navigator.permissions를 사용한 브라우저 권한
- 하드웨어 접근:
- 웹캠
- 마이크
- 선택적 권한:
- 지리위치
- 알림
- 클립보드 (읽기/쓰기)
- 권한 쿼리 및 상태 확인
- 제한 사항과 브라우저 호환성
2. navigator.mediaDevices를 사용한 미디어 장치 읽기
- 장치 열거
- 장치 변경 처리
3. 크로스-브라우저 호환성
- API 사용:
- navigator.permissions.query()
- navigator.mediaDevices.enumerateDevices()
- getUserMedia()
- Safari 대체 전략
4. 미디어 장치 처리
- 장치 초기화: getUserMedia(constraints)
- 미디어 장치 제약 조건
- 미디어 스트림 시작 및 중지
- 장치 변경 처리
5. MediaRecorder를 사용한 장치 녹화
- 스트리밍 및 녹화 시작/중지
- .webm 파일 다운로드
- 실시간 웨이브폼 미리보기
선택적 추가 기능:
- .wav 형식으로 저장 (ScriptProcessorNode 사용)
- 오디오 FFT 스펙트럼 시각화
- 데시벨 단위 볼륨 막대
- webkitSpeechRecognition을 사용한 음성 인식
피어 연결
1. 시그널링 서버
- 양방향 채널 옵션:
- WebSocket
- Socket.io
- SignalR
- 메시지 구조
- 간단한 WebRTC 클라이언트
- 전체 시그널링 흐름
2. WebRTC를 통한 비디오 채팅
- 아키텍처: Node.js + ws
- WebRTC 클라이언트: RTCPeerConnection
- 로컬 E2E 테스트
선택적 기능:
- 통화 종료 (연결 닫기, 미디어 중지)
- 그룹 채팅 (다중 사용자 방)
- 토큰 기반 간단한 인증
3. 화면 공유
- getDisplayMedia()의 사용
- 아키텍처 및 옵션
4. 세션 설명 프로토콜 (SDP)
- 개요 및 내용
- SDP 읽기 및 해석
- 코덱:
- 오디오 & 비디오
- 협상 및 제어
- 대체 전략
5. WebRTC 통계 (getStats())
- 통계 유형
- 통계 해석 방법
- 실시간 비트레이트/지터 차트
- 품질 조정 전략
6. 모든 주제는
- 실습 사례
요건
이 교육은 비디오 채팅, 화면 공유, 오디오 스트리밍과 같은 브라우저 기반 실시간 통신 기능을 구축하는 프론트엔드 및 풀스택 개발자, 기술 아키텍트, 엔지니어에게 이상적입니다. 참가자는 JavaScript와 웹 기술에 대한 기본적인 지식이 있어야 하며, Node.js와 WebSocket 기반 통신에 대한 경험은 선택적으로 요구됩니다.
14 시간
회원 평가 (3)
AI 공격과 보안 테스트를 시작하고 적극적으로 활용하기 위한 도구를 배우는过程을 매우 Enjoy 했습니다. 처음에는 없던 많은 지식을 얻었고, 과정이 제가 바란 대로 충족했습니다. 교육 중 가장 인상 깊었던 부분은 Comet Browser였으며, 그것이 할 수 있는 것에 놀랐습니다. 더 깊이 살펴보게 될 것입니다. 전반적으로 매우 좋은 과정이었고, 모든 OWASP GenAI 상위 10을 배우는 것을 Enjoy 했습니다.
Patrick Collins - Optum
코스 - OWASP GenAI Security
기계 번역됨
실습, 실습 문제, 대면 지원 및 질문.
Jose Paulos - INESC TEC
코스 - Tailwind CSS
기계 번역됨
기술적 교훈마다 여러 실습 문제가 포함되어 있어 개념을 확실히 이해할 수 있었습니다.
Andrei-Calin Bajea
코스 - OWASP Top 10 2025
기계 번역됨