1999.12.01

Email. [email protected]

Mobile. 010-9926-9679

GitHub. ****https://github.com/dali1999

Blog. https://velog.io/@dali1999/posts

• 반갑습니다! 저는 완벽을 추구하는 개발자로, 고집스럽게 몰두하는 성격 덕분에 엉덩이 몬스터 라는 별명을 가지고 있습니다.
• 팀원들과의 소통을 최우선으로 여기며, 비개발자와 개발자 모두와 원활한 소통을 통해 협업을 효과적으로 진행하는 데 중점을 둡니다.
• 협업 및 개발 효율성을 높이기 위해 협업 시나리오 및 컨벤션을 문서화하여 공유하는 등의 노력을 기울이고 있습니다.
• 유저의 심리를 이해하여 최적의 경험을 설계하고, 꾸준한 관찰과 학습을 통해 더 나은 방향을 제시할 수 있습니다.

Skills

HTML/CSS JavaScript TypeScript React.js Next.js

styled-components Tanstack Query Zustand Figma

Education

홍익대학교

$\scriptsize\bf\color{838383}{컴퓨터공학~학사}$

2018.03 ~ 2024.02

Projects

EFFI $\tiny\bf\color{838383}{팀~프로젝트}$

24.05 ~ 24.07

소개

N:M 화상 통화와 채팅 기능을 갖춘 회의 보조 도구로, 회의 내용을 요약·정리하여 시각적으로 제공하는 협업 중심의 실시간 통신 서비스

기술 스택

React.js TypeScript Tanstack Query Zustand Styled Components

WebSocket Stomp WebRTC

링크

배포 : https://cli.effi.club/ (서버 비용 문제로 인한 배포 중단)

깃헙 : https://github.com/part4-project/effi_frontend

역할

프로젝트 팀장, 프론트엔드 리드

기여 내용

프론트엔드 개발 프로세스를 관리하고 서포트했습니다. 백엔드 팀 및 디자이너와의 효과적인 의사소통과 협업을 주도하여 성공적인 결과물을 도출시켰으며, 기술적 성장뿐만 아니라 팀원들과 돈독한 관계를 형성할 수 있었습니다.

• 프론트엔드 개발 환경 설정 (노션)
• WebRTC, WebSocket을 이용한 N:M 실시간 화상 통신 기능 (깃 위키)

  • 초기 테스트로 Mesh 구조를 사용해 구현했지만, 4인 이상 참여 시 통신 성능이 크게 저하되는 문제가 발생하였습니다.

    이를 해결하기 위해 중앙 서버 방식인 SFU(Selective Forwarding Unit) 구조로 변경하여 12명의 참가자와 원활한 통신이 가능한 것을 확인하였고, N명의 각 참가자가 관리해야 할 스트림 수를 N-1 에서 1 개로 줄여 대역폭 효율성을 개선했습니다.

  • 일정 시간이 지나면 클라이언트의 socket 통신이 끊어지는 문제가 발생하였습니다.

    이후 초 단위로 자세히 분석한 결과, 서버의 ELB가 1분 이상 유휴 상태인 클라이언트 연결을 종료하는 것을 확인하였고, 주기적으로 클라이언트와 서버 간 메시지를 교환하는 heartbeat 기능을 구현하여 실시간 통신 중에 지속적인 연결을 보장시켰습니다.

  • 각 참여자의 카메라와 마이크 상태를 실시간으로 표시하여, 모든 참가자가 상대방의 미디어 상태를 즉시 확인할 수 있도록 했습니다.

  • 실시간으로 변화하는 참가자 수에 대응하는 동적 카메라 레이아웃을 설계 및 구현했습니다.

• 사용자 정보, 회의, 회의록에 대한 CRUD 기능 개발
• Google OAuth 로그인 (깃 위키)
  • 백엔드 팀과 협력하여 Google OAuth를 통한 원활한 인증 프로세스를 구현했습니다.

AndChill $\tiny\bf\color{838383}{개인~프로젝트}$