항해99 클론코딩주차였다.
주어진 기간은 일주일이였고, 프론트2명 백엔드3명으로 팀이 이루어졌다.
일단 나름 한 번 협업을 해봤다고, 협업이 익숙해지고 편안해지기 시작했다. 이번주는 처음으로 팀원들과 오프라인 만남을 가져보았고, 1박2일동안 코딩도 하고, 맛난 것도 많이 먹었다.
슬랙을 클론하기로 결정한 이유는 넷플릭스로 방향을 잡아보려 했으나, 생각보다 간단하고 themoviedbAPI를 이용하면 백엔드와 교류할 필요도 없을 것 같아서 넷플릭스에서 슬랙으로 경로를 바꾸었다. 아마 유명한 마켓컬리나 에어비앤비도 생각보다 심심했을 거라고 생각한다. (기능적으로 특별한 부분이 없기때문에?_)
슬랙은 그래도 기존까지 우리가 해왔던, CRUD에서 조금 벗어나 웹소켓을 써볼 기회가 있어 재미있었던 것 같다.
일주일동안 구현한 기능은 아래와 같다.
- 슬랙 채널마다 실시간 채팅방기능 구현 (생각보다 채널을 눌렀을 때, 그 채팅방의 데이터를 불러오는 것 까지 힘듦)
- 카카오소셜로그인 (그냥 카카오 디벨로퍼스에 있는 문서를 따라하니, 손쉽게 해결되었다.)
- 이메일 코드인증 시스템 (백에서 구현해주었는데, 이메일을 입력하면 이메일로 코드를 발송해준다. 일치하지 않으면 로그인을 할 수 없다.)
이렇게 적고보니, 일주일동안 뭘한거지..?
실시간 채팅이 가장 중요한 기능이라, 구현해서 다행이지만 좀 더 할 수 있었을거라는 아쉬움이 남는다.
소켓을 잘 다루기 위해서는 렌더링에 대해 잘 이해할 수 있어야 한다. 자칫하면, 소켓이 연결이 끊어졋다 연결되는 일이 잦기 때문이다. 따라서 이번주는 아쉽게도 로컬스토리지를 이용하여, 채널데이터를 보관하였지만 다음에는 useRef나 다른 방법을 사용해 구현해보고 싶다.
아무래도 시간을 가장 많이 잡아먹은 부분은 클라이언트와 서버단에서 소켓을 연결하는 일이였다.
연결따위는 코드 몇줄만 작성하면 되는 거라, 금방될 줄 알았는데 생각보다 여러 오류가 발생했던 것 같다.
그리고 다른 조에서도 비슷한 트러블을 겪는 것을 보고, 따로 웹소켓 트러블슈팅이라는 주제로 작성할 예정이다.
아래는 슬랙클론을 진행했던 본인의 깃허브주소이다. (코드를 참고하려면, 아래에서 보면 된다.)
https://github.com/kkkimjiyong/Slack_Clone
kkkimjiyong - Overview
kkkimjiyong has 15 repositories available. Follow their code on GitHub.
github.com