Flutter의 프론트엔드와 백엔드를 관측하는 Toolchain(Sentry.io, ClickUp, Grafana)
오늘부터 flutter 앱을 테스트하고 유지보수하기 위해, 오류를 감지하고 이슈를 관리하는 툴의 사용법을 익혀, 실제 실무에서 사용하는 기본적인 방식을 정리해보려고 한다.
1. Sentry io : 실시간 Flutter(front-end) 감시 서비스
해당 서비스가 어떤 기능들을 갖추고 있는지는 파악하지 못했다. 다만 배포한 Flutter 앱을 해당 디바이스의 상태(CPU, LAM, Network 사용량 등)와 에러, 성능 저하 등을 실시간으로 모니터링하여 이슈를 파악할 수 있는 서비스라고 정리할 수는 있다. 기존에 디바이스와 컴퓨터를 케이블로 연결하여 로그를 분석하던 방식을 떨어져서 웹 UI를 통해 확인할 수 있는 개발자 도구라고도 볼 수 있겠다.
정리하자면 클라이언트(배포된 Flutter)에서 발생하는 Crash, Error, 성능 저하를 실시간으로 수집하고 분석하는 플랫폼이다. 분석이라고 하면 에러가 발생하기 직전의 사용자 행동 경로를 추적할 수도 있고, 당시 메모리 부족으로 발생한 것인지 아니면 다른 이유로 발생한 것인지 하드웨어의 상태도 확인할 수 있어, 원인 파악에 용이하다.
- ClickUp : Project Manage 및 생산성 관리
우리의 프로젝트에서는 앞서 Sentry에서 발생한 문제를 연동하여 이슈로 생성하고 관리하는 이슈관리 플랫폼이라고 정리할 수 있다. 우측 하단의 Issue Tasking 버튼을 통해서 ClickUp에 이슈를 할당할 수 있다.
그러면 아래와 같이 ClickUp으로 이동하여 다음과 같이 task를 할당하고 관리할 수 있다.
본래 기능은 더 다양하다. 우리가 사용하는 이슈 트레킹, 문서 관리, 일정 관리를 모두 사용할 수 있는 올인원 협업 플랫폼이라고 볼 수 있다. 이전에 사용해본 Gitlab의 이슈 보드는 개발자 친화적이지만, 기획자나 테스터 PM 등이 사용하기에는 기능이 제한적이라는 단점이 존재했다. ClickUp은 개발 이슈를 넘어 기획 문서와 회의록, 로드맵을 모두 관리할 수 있는 워크플로우를 통합하는 서비스이다. 우리가 자주 사용하는 간반 보드와 리스트, 간트 차트 등을 생성하여 프로젝트의 현황을 확인할 수 있다.
3. Grafana : 인프라(backend) 모니터링
마지막으로 Grafana의 경우 infrastructure(linux, nginx, postgreSQL 등) 등의 데이터 소스를 연결하여 대시보드의 형태로 시각화해주는 오픈소스 플랫폼이다. 주로 백엔드 서버와 인프라의 상태를 확인하기 위해 사용한다. API 서버가 제대로 동작하는지, 응답 속도에 문제가 생겼거나 CPU 사용량이 폭주하는가 등을 감시한다. 앞서 플러터의 문제를 파악해주는 것과 동일 선상에 있는데, 이는 백엔드에 초점이 맞춰져 서버측의 문제를 확인할 수 있게 해주는 것이다.
정리 : 테스트 및 유지보수를 위한 도구들
실시간성, 안정성, 보안성이 중요한 프로젝트에서 위 도구들은 아주 중요하다. 특히 영상 스트리밍 디코딩 과정에서 발생하는 네이티브 문제(기기별, 네트워크, 성능)을 모니터링하기 위해 Sentry.io에서 확인한다. API 서버와 데이터베이스 등의 응답 속도, 과부하, 에러율 등을 감지하고 확인시켜주는 Grafana를 사용한다. 마지막으로 이슈들을 정리하고 일정을 만들고 소스코드를 관리하는 워크플로우를 통합해줘야 한다. ClickUp, GitLab은 이들을 관리하고 확인하는 용도로 사용한다.
