
Spring-based REST API development
whiteship
This course develops a REST API that satisfies Self-Descriptive Message and HATEOAS (Hypermedia as the engine of application state) using various Spring technologies.
중급이상
Spring, REST API, Java
웹에서 미디어(비디오, 오디오)를 다루는 방법!! 이제 어렵지 않습니다. 하나하나 씩 따라하면서 배우는 MediaStream API 와 WebRTC
MediaStream API
WebRTC
WebSocket
실전 프로젝트에 적용 할 수 있는 기술
웹에서 미디어(비디오, 오디오)를 다루는 방법!!
이제 어렵지 않습니다.
하나하나 씩 따라하면서 배우는 MediaStream API 와 WebRTC
MediaStream API를 통해 미디어를 다루는 방법을 배웁니다
WebRTC를 사용하여 미디어를 전송하고 수신하는 법을 배웁니다
WebSocket을 이용하여 화상회의 시스템을 만들어 봅니다
실제 실무에서 화상회의 프로젝트를 진행하면서 터득한 노하우 및 각종 팁의 제공
여러 Web API 중 MediaStream API 에 대해 다루며 WebRTC에 대한 기본적인 내용을 예제를 진행하면서 학습해 나갑니다.
JavaScript와 React를 이용한 프로젝트를 생성하여 진행합니다.
MediaStream API 및 WebRTC에 대해 설명하고, 예제를 작성하기 위한 프로젝트를 준비합니다.
카메라 및 마이크로 부터 MediaStream을 얻는 기본적인 방법을 다룹니다.
미디어 장치를 조회하고 장치의 정보를 알아봅니다.
MediaStream에 적용할 수 있는 각종 옵션에 대해 다룹니다.
MediaConstraints를 이용해 카메라의 줌 기능을 구현해 봅니다.
MediaPipe 라이브러리를 이용하여 카메라의 영상을 수정하고, 새로운 MediaStream을 만드는 방법을 배웁니다.
Audio를 다루는 기본적인 방법을 배우고, Audio의 Gain 값 조절을 통해 소리의 크기를 변경하고 Audio 그래프를 그려봅니다.
webrtc 에 대한 기본적인 내용을 학습하고, 미디어를 전송하고 수신하는 방법을 배웁니다.
실무에 가까운 프로젝트를 진행하면서 화상회의 시스템을 만들어 봅니다.
JavaScript와 React를 이용한 FrontEnd 프로젝트 및 Java와 Spring을 이용한 BackEnd 프로젝트를 생성하여 진행합니다.
이전에 배운 내용을 종합하여 화상대화에 참여하기 전의 FrontEnd 기능을 구현합니다.
websocket 을 이용하여 화상대화를 관리하기 위한 서버 프로그램을 만듭니다.
서버 프로그램과 직접 통신을 하고, 각종 Event를 처리하며 실제 화상 대화 기능을 구현합니다.
운영 체제 : 카메라 및 마이크가 장착되어 있는 Windows 혹은 macOS 환경의 PC
사용 도구: VisualStudio Code, npm, docker, java, maven
각 섹션 별로 완성된 소스코드를 제공합니다.
카메라 및 마이크가 설치된 PC를 준비하셔야 제대로 된 실습을 진행 하실 수 있습니다.
학습 대상은
누구일까요?
웹에서 다루는 미디어에 관심이 있으신 분
기본 문법 학습 후에 실전에서 사용할 수 있는 기술을 익히고자 하는 분
WebRTC에 관심이 있으신 분
WebSocket을 배우고자 하시는 분
선수 지식,
필요할까요?
JavaScript (기본 문법에 대한 지식이 필요하고, Promise의 개념을 알고 계시면 좋습니다)
React (필수는 아니지만, State에 대한 개념을 알고 계시면 좋습니다)
Java (기본 문법에 대한 지식이 필요합니다)
Spring (필수는 아니지만, SpringBoot로 프로젝트를 구성하는 방법을 알고 계시면 좋습니다)
전체
85개 ∙ (11시간 49분)
해당 강의에서 제공:
1. MediaStream 이란
08:31
2. 실습 환경 준비
12:18
4. MediaStream 요청
09:43
5. MediaStream 재생
06:50
6. MediaStream 해제
05:07
8. MediaStream 자동재생
08:09
9. 화면 공유
04:23
11. 장치 조회
10:53
12. 권한 획득
06:59
13. 장치 변경 감지
08:51
16. UI 준비
06:40
17. 장치 지정
10:56
20. Media Settings
08:46
22. UI 준비
05:58
23. Zoom 기능
03:42
24. Zoom 적용
12:00
26. UI 준비
10:39
27. Image Segmenter
08:58
28. Capture Video
08:15
29. ImageData 구조
06:56
30. MaskImage
11:12
31. SegmentImage 그리기
07:35
32. MediaStream 생성
10:36
34. AudioContext
07:09
35. AudioNode
09:14
37. AudioData 그리기
12:54
38. AudioData 그리기 2
08:56
39. GainNode
04:01
40. GainValue 변경
07:30
43. WebRTC 란
16:10
44. UI 준비
04:56
47. Media 전송
11:13
49. Media 수신
07:15
51. Project 생성
04:32
52. Module 설정
13:04
53. 대기화면 구성
19:08
54. 대화화면 구성
08:45
55. 카메라 장치
06:43
56. 카메라 장치 선택
16:27
57. 마이크 장치 선택
11:19
58. AudioNode 구성
09:36
59. 마이크 장치 동작 확인
11:37
61. 입장 기능
09:10
63. Project 생성
06:32
64. WebSocket 설정
12:48
65. Message
13:06
67. MessageSender
17:23
68. Message Handler
14:47
69. Message 처리
11:37
70. UserJoin 기능
16:48
72. UserLeft 기능
09:47
74. WebMediaClient
07:12
75. Transaction
14:54
76. Message 보내기
11:14
77. 입장 기능
15:24
78. Publish
15:44
79. Subscribe
07:52
80. User Event 처리
08:33
81. Custom Hook
13:05
82. Exit 기능
10:22
85. 감사합니다
02:23
전체
1개
₩89,100
같은 분야의 다른 강의를 만나보세요!