웹 개발자의 데이터 애플리케이션 flow 효율화하기

간단 소개

데브시스터즈의 Dash 도입 사례를 통해 데이터 앱 아키텍처 개선 및 효율적인 개발 방안을 제시합니다.

AI Summary

Dash 도입 배경 및 이유
- 데브시스터즈는 기존 데이터 시각화 도구의 한계를 극복하고, 데이터 엔지니어와 웹 개발자 모두에게 친화적인 data app framework를 찾고자 Dash를 선택했습니다.
- Plotly 기반의 차트 시각화, React 컴포넌트 연동 용이성, stateless 디자인을 통한 확장성, Flask 기반의 웹 앱 기능 활용 등이 주요 선택 이유입니다.
아키텍처 개선 및 문제 해결
- 단일 callback 구조의 복잡성, 코드 중복, 비효율적인 데이터 처리 문제를 해결하기 위해 FetchProvider, TransformProvider, RenderProvider로 역할을 분리했습니다.
- MVC 패턴을 적용하여 데이터 요청, 가공, 시각화 단계를 명확히 구분하고, 데이터 압축(gzip, br)을 통해 성능을 개선했습니다.
코드 재사용성 및 유지보수성 향상
- Mixin 클래스를 활용하여 차트의 공통 기능을 모듈화하고, 디자인 시스템에 맞는 스타일을 적용하여 코드 재사용성을 높였습니다.
- 데브시스터즈는 Dash 도입을 통해 복잡한 인터랙션에도 간단한 코드 구조를 유지하고, 데이터 처리 효율성을 높였습니다.