Githru : 버그 수정 및 안정성 개선

---

프로젝트 배경

프로덕션 환경에서 다양한 Git 호스팅 서비스 지원, UI 렌더링 이슈, 에러 핸들링 부족 등의 문제가 발견되었습니다. 사용자 경험 개선과 안정성 확보를 위해 체계적인 버그 수정이 필요했습니다.

주요 구현 내용

1. Azure DevOps URL 파싱 지원

getRepo 함수를 개선하여 Azure DevOps URL 형식을 분석하고 파싱하는 로직을 구현했습니다(144줄 추가, 9줄 수정). 정규표현식 기반 URL 패턴 매칭을 적용하여 기존 GitHub, GitLab 지원에 Azure DevOps를 추가했습니다. SSH와 HTTPS 등 다양한 URL 형식을 지원하며, 엣지 케이스 처리와 에러 메시지도 개선했습니다.

2. FileIcicleSummary 중복 렌더링 해결

ClusterNode 선택 시 발생하던 렌더링 이슈를 수정했습니다(1줄 수정). 상태 업데이트 로직을 최적화하여 불필요한 리렌더링을 방지했고, UI 깜빡임을 제거하여 성능을 개선했습니다. 단 1줄의 수정으로 큰 효과를 달성한 사례입니다.

3. Author Avatar 에러 핸들링

이미지 로드 실패 시 기본 아바타를 표시하는 Fallback 로직을 구현했습니다(17줄 추가, 6줄 수정). onError 이벤트 핸들러를 추가하여 네트워크 오류 상황에 대응했고, Graceful degradation 패턴을 적용하여 사용자 경험 저하를 방지했습니다.

4. 데이터 유효성 검증

useAnalyzedData에 검증 로직을 추가했습니다(8줄 추가). null/undefined 체크, 빈 배열 처리, 타입 가드를 구현하여 런타임 에러를 사전에 방지하고 안전한 데이터 접근을 보장하도록 했습니다.

5. Adapter 구조 정렬

FakeIDEAdapter와 VSCodeIDEAdapter의 페이로드를 통일했습니다(7줄 수정). 인터페이스 일관성을 확보하여 개발 환경과 프로덕션 환경을 동기화했고, 타입 안정성이 향상되어 통합 테스트의 신뢰도가 증가했습니다.

1. Step 1

   Azure DevOps URL 파싱 지원 (144줄 추가)

2. Step 2

   FileIcicleSummary 중복 렌더링 해결 (1줄 수정)

3. Step 3

   Author Avatar 에러 핸들링 (17줄 추가)

4. Step 4

   useAnalyzedData 유효성 검증 (8줄 추가)

5. Step 5

   Adapter 페이로드 구조 정렬 (7줄 수정)

기술적 성과

사용 기술

• TypeScript
• 정규표현식 (URL 파싱)
• React 에러 바운더리
• 타입 가드 및 런타임 검증
• Graceful degradation 패턴

측정 가능한 결과

Azure DevOps 지원을 추가하여 3대 Git 호스팅 서비스를 모두 커버하게 되었습니다(144줄). 5개 이상의 버그를 수정했고, 에러 핸들링 로직 추가로 전반적인 안정성이 향상되었습니다. 사용자가 보고한 이슈를 해결하여 크래시 발생률이 감소했습니다.