서비스 소개
이 프로젝트는 Node.js, WebRTC 및 Websocket을 사용하여 만든 비디오 회의 플랫폼입니다.
기능 소개
-
홈 화면에 화면, 음성 on/off 기능
방 입장 시 사용자의 편의에 따라 끄고 킬 수 있습니다.
-
화면 바꾸기 기능
상대방 입장 시 저의 화면이 작은 화면에 상대방의 화면이 큰 화면에 가도록 위치시켰습니다. 나의 화면을 크게 보고싶다면 작은 화면에 있는 바꾸기 버튼을 클릭하여 화면 위치를 변경 가능하도록 만들었습니다.
-
전체 화면 기능
화면의 크기를 자유롭게 변화 가능하도록 만들었습니다.
-
사진과 이모티콘 전송 기능
문자뿐만 아니라 이모티콘과 사진 전송이 가능 하도록 만들었습니다. 아래 첫번째 사진은 상대방과 나의 대화이고 마지막 사진은 이모티콘 박스 사진입니다.
-
나와의 채팅 기능
나와의 채팅을 하고 있을 경우 상대방에게 메시지가 전달 되지 않습니다.
-
문자 온 걸 알려주는 점 기능
내가 비디오 화면에 있거나 혹은 나와의 채팅을 하고 있을 경우 상대방에게 온 메시지를 바로 알아볼 수 있도록 message button, chat button 위에 빨간 점을 표시하여 문자 온 걸 바로 알수 있도록 만들었습니다.
개발 과정 (어려웠던 점과 해결방법)
Backend, Frontend, Design 어디 하나 쉬운 게 없었습니다. 특히 어려웠던 부분은 대화 상자의 사진 전송 기능이었습니다. 나의 사진을 상대방에게 전송하기 위해 multer을 사용하여 사진을 저장, 변환시켜준 뒤 글자를 전송하는 데신 변화된 주소를 전송함으로써 상대방의 대화 상자에도 사진이 나올 수 있도록 만들었습니다.
