hello! I'm Hyunhun Kim, a developer we would like to collaborate with 👋
Problem Solver Team Player Clean Coder User-Focused Developer
네이버 부스트캠프 Web 9기 Front-End Engineer
2024 Naver Boostcamp Web Development Course
기간: 2024.08.19 - 2024.12.06
주요 활동:
- 웹 프로그래밍 심화 학습 및 실무 프로젝트 수행
- 팀 프로젝트를 통한 협업 경험 강화
- 코드 리뷰와 페어 프로그래밍을 통한 코드 품질 향상
A real-time collaborative Markdown editor powered by CRDT
🔗 Live Demo | 📘 GitHub Repository
프로젝트 소개: 실시간으로 여러 사용자가 동시에 마크다운 문서를 편집할 수 있는 웹 애플리케이션입니다. CRDT 알고리즘을 활용하여 동시성 문제를 해결하고, 실시간 협업 기능을 구현했습니다.
담당 업무 및 성과:
-
- RGA 기반 이중 링크드리스트로 CRDT 설계
- EditorCRDT와 BlockCRDT 분리하여 확장성 부여
- 기존 단일 CRDT에서 다중 분리 구조로 변경하여 텍스트 동기화 성능 개선
-
- 사용자별 워크스페이스 접근 권한 시스템 설계 및 구현
- WebSocket 기반 페이지별 실시간 다중 접속 관리 및 상태 동기화
- Socket.io를 활용한 실시간 알림 시스템(Toast)으로 협업 경험 개선
-
-
- 디자인: 피그마
- 애니메이션: Phase, Lotties
문제 해결 경험:
-
- 여러 문서를 동시에 편집할 때 유저들의 캐럿이 의도치 않게 다른 위치로 이동하는 현상 발생
- 해결 방법:
- 글로벌 상태로 관리되는 캐럿 위치가 모든 문서에 영향을 미치는 것을 확인
- 문서별로 독립적인 캐럿 상태 관리의 필요성 도출
- 로컬상태에서 페이지별 독립 캐럿 상태 관리 시스템 구현(setCaretPosition)
- 결과:
- 실시간 다중 사용자 편집 시에도 일관된 사용자 경험 제공
-
- 다수 사용자의 동시 입력 시 과도한 소켓 통신으로 인한 서버 부하 발생
- 과도한 통신량으로 인한 실시간 동기화 지연 및 동기화 누락 현상 발생
- 해결 방법:
- 사용자 입력 패턴 분석 (평균 0.5초당 3회 타이핑) 기반 배치 처리 도입
- 결과:
- 초당 소켓 통신량 70% 감소로 서버 리소스 효율화
- 네트워크 대역폭 사용량 최적화로 안정적인 동기화 성능 확보
