웹에서 미디어를 다루는 방법 MediaStream API

웹에서 미디어를 다루는 방법 MediaStream API

웹에서 미디어(비디오, 오디오)를 다루는 방법!!

이제 어렵지 않습니다.

하나하나 씩 따라하면서 배우는 MediaStream API 와 WebRTC

• MediaStream API를 통해 미디어를 다루는 방법을 배웁니다

• WebRTC를 사용하여 미디어를 전송하고 수신하는 법을 배웁니다

• WebSocket을 이용하여 화상회의 시스템을 만들어 봅니다

• 실제 실무에서 화상회의 프로젝트를 진행하면서 터득한 노하우 및 각종 팁의 제공

이런 내용을 배워요

전반부

여러 Web API 중 MediaStream API 에 대해 다루며 WebRTC에 대한 기본적인 내용을 예제를 진행하면서 학습해 나갑니다.

JavaScript와 React를 이용한 프로젝트를 생성하여 진행합니다.

섹션 (1) 시작하기

MediaStream API 및 WebRTC에 대해 설명하고, 예제를 작성하기 위한 프로젝트를 준비합니다.

섹션 (2) MediaStream 기본

카메라 및 마이크로 부터 MediaStream을 얻는 기본적인 방법을 다룹니다.

섹션 (3) Media 장치

미디어 장치를 조회하고 장치의 정보를 알아봅니다.

섹션 (4) MediaConstrainsts

MediaStream에 적용할 수 있는 각종 옵션에 대해 다룹니다.

섹션 (5) Zoom

MediaConstraints를 이용해 카메라의 줌 기능을 구현해 봅니다.

섹션 (6) MediaStream 생성

MediaPipe 라이브러리를 이용하여 카메라의 영상을 수정하고, 새로운 MediaStream을 만드는 방법을 배웁니다.

섹션 (7) AudioContext

Audio를 다루는 기본적인 방법을 배우고, Audio의 Gain 값 조절을 통해 소리의 크기를 변경하고 Audio 그래프를 그려봅니다.

섹션 (8) WebRTC

webrtc 에 대한 기본적인 내용을 학습하고, 미디어를 전송하고 수신하는 방법을 배웁니다.

후반부

섹션 (9) 실전 프로젝트 - FrontEnd Part 1

이전에 배운 내용을 종합하여 화상대화에 참여하기 전의 FrontEnd 기능을 구현합니다.

섹션 (10) 실전 프로젝트 - BackEnd

websocket 을 이용하여 화상대화를 관리하기 위한 서버 프로그램을 만듭니다.

섹션 (11) 실전 프로젝트 - FrontEnd Part2

서버 프로그램과 직접 통신을 하고, 각종 Event를 처리하며 실제 화상 대화 기능을 구현합니다.

수강 전 참고 사항