newChobo
article thumbnail
줌 클론코딩 #3 VIDEO CALL
공부/NodeJS 2023. 2. 16. 22:23

#3.0 User Video (09:03) 챗 파트 끝나서 모든 코드 지웠음. 화상회의 관련 기능들 구현할것. 음소거/음소거 해제, 카메라 on/off, 카메라 전/후면 전환(모바일일 경우) 일단 웹에서 카메라, 소리 가져오기 어케하는지 배울꺼고, js가 해줄 것. js로 유저 컴퓨터의 카메라 list를 얻을 수 있다. https://developer.mozilla.org/en-US/docs/Web/API/MediaDevices/getUserMedia navigator.mediaDevices.getUserMedia(constraints); 는 유저의 유저미디어 string을 줄 것. //app.js async function getMedia(){ try { myStream = await navigator..

article thumbnail
줌 클론코딩 #2 SOCKETIO
공부/NodeJS 2023. 2. 15. 00:58

#2.0 SocketIO vs WebSockets (07:20) SOCKET.IO 에 대해 배워보자. 실시간, 양방향, event 기반 통신 가능하게 함. Socket IO는 websocket을 실행하는게 아니다. Socket IO는 framework, 실시간 + 양방향 + event 기반 통신 websocket보다 탄력성이 뛰어나다? 웹소켓이 안되도 socket IO는 작동을 한다.(?) Socket IO는 websocket을 가끔 써서 기능 제공하는 프레임워크다. websocket없어도 기능제공한다. websocket 지원 안하면 HTTP long polling같은것을 사용한다고 한다. Socket IO는 인터넷이 잠깐만 끊겨도 재 연결을 시도한다. 우리는 필요하면 직접 만들어내야 한다. 웹 소켓보다..

줌 클론코딩 #1 CHAT WITH WEBSOCKETS
공부/NodeJS 2023. 2. 13. 22:09

#1.0 Introduction (02:14) 실시간 채팅 기능. websocket, JS 채팅방같은거 만드는 법도 배울 것. event? #1.1 HTTP vs WebSockets (09:05) http : stateless? backend가 유저를 기억하지 못한다. auth? 서버는 나를 잊어버린다. stateless 백엔드서버는 response 후에 잊어버림. request 받을 때만 답장(response)함 => real-time이 아니다. WebSocket? wss? Secure Web Socket : http와 다름. 연결되면 서버에서 클라이언트로도 먼저 대화 가능. 악수처럼 연결중일때만 가능. 서로 접근 가능. 서버는 언제나 유저에게 요청 가능. 유저도 마찬가지. 브라우저에는 내장된 webS..

줌 클론코딩 #0 INTRODUCTION
공부/NodeJS 2023. 2. 12. 23:15

#0.0 Welcome (01:13) js만으로 프로그램 만들어볼 것. 웹소켓, 채팅방 생성, 개인 메세지 기능 등을 100줄 이하로 구현 NodeJS가 실시간 기능 구현에 좋다. #0.1 Requirements (03:24) 근데 ExpressJS에 대해 알고있어야 하고, Pug가 뭔지도 알아야 하고, template도 뭔지 알아야 한다. ...~~~ ...아직 준비가 안되었다...지만 이전 강의는 유료이니 일단 해보자. #0.2 Server Setup (07:17) 프로젝트 설정. 원래는 package.json, Nodemon, Babel 등 이 뭔지 알고 있어야 함... npm 설치하고 파일들 만들어줌 git init . npm i @babel/core @babel/core @babel/cli @b..