2주 동안 만든 줌 클론

1. 자기소개

안녕하세요

저는 이제 웹개발의 영역에 들어선지 이제 막 3개월차로 접어드는 웹린이 개발자라 합니다.

지금은 향방을 정하고, 웹의 걷는 취준린이라, 리액트에 들어서는 것이 맞다고 생각하지만, 유투브 챌린지를 끝마치고, 리액트에 들어서기 전, 조금 더 js를 만져보고 싶다는 생각에 참여했습니다.

2. 서비스소개

예전에 끄투를 할 때의 추억을 살려서 비슷한 테마 분위기를 내고 싶던 1대1용 채팅방 사이트입니다.

3. 개발과정 (어려웠던 점과 해결방법)

클릭을 통한 대기방의 입장 구현은 재미있었던 것 같습니다.
또한 서로 대화를 하는 것을 나타내고자, 보더를 요리조리 갖고 놀았고, 네 개의 창들이 서로 사이의 틈만을 두고선 한 모양이라는 분위기를 주고자, 우측 사이드 창들의 스크롤은 direction을 사용해 왼쪽으로 옮긺으로서 해결하였습니다.

어려웠다라고 생각한다면, 다 대 다에 대한 네트워크 이해가 낮아 기간 동안 구현하지 못하였고,

제한 인원에 대해서 어떻게 처리를 하지 하던 고민은 앱에서 공개방의 정보를 가지고 있기에 해당 방제목을 가지고서, 인원이 초과할 시 입장을 못하도록 제한하는 것으로 해결하였지만, 이게 최선일까 하는 것 같은 아쉬움이 남았습니다.

4. 앞으로 계획

마음 같아서는 해당 프로젝트에 대해 좀 더 집요하게 파고서 다 대 다 통신이나, 위에서 말한 입장 제한과 같은 부분들을 수정을 하며 조금 더 바닐라JS를 다뤄보고 싶지만,

아마 지금은 아쉬움을 마음에 담고, 리액트를 들어가야 할 때라고 생각하여, 다음에 글을 작성해본다면 리액트 JS 챌린지에서 올려볼 것 같습니다.

언젠가 과거를 돌아볼 때, 못다한 기능들에 대한 업데이트를 진행해보고 싶습니다.

긴 글이지만, 여기까지 읽어주셨다면 모두들 감사드립니다.

5. 결과물 URL

https://onechat-w.herokuapp.com/

6. 결과물 사진

해당 로비

채팅방 생성 시 화면

상대방과의 채팅