마켓플레이스 통합: 도구의 라이브 데이터를 아키텍처 위에 - Archyl Blog

아키텍처 다이어그램은 무엇이 존재하는지 알려줍니다. 대시보드는 어떻게 운영되고 있는지 알려줍니다. 이 두 가지는 항상 별도의 도구에 있었습니다. 오늘 우리는 이를 합칩니다. Archyl의 새로운 마켓플레이스를 통해 Datadog, GitHub, SonarQube, Prometheus, ArgoCD, GitLab, PagerDuty를 연결하고 — 라이브 위젯으로 아키텍처 작업 공간에 직접 데이터를 표시할 수 있습니다.

마켓플레이스 통합: 도구의 라이브 데이터를 아키텍처 위에

지난달 한 팀이 프로덕션 인시던트를 일곱 개의 브라우저 탭에서 디버깅하는 것을 지켜봤습니다. 메트릭은 Datadog. 배포 이력은 GitHub. 누군가 오버라이드했을 수 있는 퀄리티 게이트는 SonarQube. 파드가 실제로 생각한 버전을 실행하고 있는지 확인하려면 ArgoCD. 그리고 어딘가 백그라운드에서 아키텍처 다이어그램이 다른 탭에 있었습니다. 완벽하게 정확하고, 완벽하게 정적이며, 당면한 문제에는 완벽하게 쓸모없는.

다이어그램은 시스템이 무엇인지 말해줬습니다. 어떻게 운영되고 있는지는 말해줄 수 없었습니다.

이것은 도구의 실패가 아닙니다. 각 도구는 자기 역할에서 훌륭합니다. 문제는 도구 사이의 간극입니다 — 끊임없는 컨텍스트 전환, 대시보드에서 다른 대시보드로 점프할 때마다 재구축해야 하는 멘탈 모델, 아무도 큰 소리로 묻지 않는 암묵적인 질문: "이 일곱 개 도구 중 어떤 것이 지금 실제로 봐야 할 것을 보여주고 있는가?"

마켓플레이스 통합은 그 간극을 메우기 위해 만들었습니다.

아이디어

전제는 간단합니다: 아키텍처 다이어그램은 이미 시스템의 지도입니다. 무엇이 존재하고, 어떻게 연결되며, 어떤 프로토콜을 사용하는지 이해하기 위해 가는 곳입니다. 왜 것들이 어떻게 실행되고 있는지 보는 곳이기도 하면 안 될까요?

Archyl의 마켓플레이스를 통해 외부 서비스 — Datadog, GitHub, GitLab, Prometheus, SonarQube, ArgoCD, PagerDuty — 를 연결하고 프로젝트 대시보드에 라이브 위젯으로 데이터를 표시할 수 있습니다. 스크린샷이 아닙니다. 링크가 아닙니다. 30초마다 새로고침되는 실제 라이브 데이터가 C4 다이어그램 바로 옆에 있습니다.

배포하는 컨테이너 옆의 배포 상태 배지. 측정하는 서비스에 연결된 코드 커버리지 카운터. 불타고 있는 아키텍처의 맥락에서 무엇이 불타고 있는지 보여주는 알림 목록.

연결할 수 있는 것

대부분의 팀이 이미 사용하는 도구 체인을 커버하는 일곱 개 제품으로 출시했습니다:

Datadog — 상태 모니터링, 메트릭 쿼리, 활성 알림, 임베디드 대시보드. 이미 Datadog을 사용하여 인프라를 모니터링하고 있다면, 단일 쿼리를 복제하지 않고 동일한 데이터를 아키텍처 작업 공간에 표시할 수 있습니다.

GitHub — 워크플로우 상태, 오픈 풀 리퀘스트, 리포지토리 통계, Dependabot 알림, 시크릿 스캐닝, 코드 스캐닝. 보안 위젯만으로도 설정할 가치가 있습니다 — 각 리포지토리의 보안 탭을 개별적으로 확인하는 대신, 아키텍처에 대해 맥락화된 발견 사항을 볼 수 있습니다.

GitLab — 파이프라인 상태, 머지 리퀘스트, 프로젝트 통계, 전체 보안 스캐너 제품군: 취약점 분석, SAST, 시크릿 탐지, DAST. GitHub과 같은 아이디어로 GitLab 에코시스템에 네이티브합니다.

Prometheus — 현재 메트릭 값에 대한 인스턴트 쿼리, 시계열 차트로 렌더링되는 범위 쿼리, 타겟 상태 모니터링. 핵심 메트릭에 대한 PromQL 쿼리가 이미 있다면 아키텍처 작업 공간에 직접 표시할 수 있습니다.

SonarQube — 퀄리티 게이트 상태, 프로젝트 측정(커버리지, 버그, 취약점, 기술 부채), 심각도별 이슈, 보안 핫스팟, 보안 등급. 퀄리티 게이트 위젯이 특히 유용합니다: 서비스당 녹색 또는 빨간색 배지 하나로 코드가 표준을 충족하는지 즉시 알 수 있습니다.

ArgoCD — 애플리케이션 상태 및 동기화 상태, 애플리케이션 인벤토리, Kubernetes 리소스 목록, 필터링을 통한 애플리케이션 수. Kubernetes에서 실행하는 팀에게 이것은 C4 다이어그램을 배포 대시보드로 변환합니다.

PagerDuty — 인시던트 상태, 활성 인시던트 목록, 온콜 스케줄, 서비스 상태, 인시던트 수. 인시던트 대응을 관리하는 팀에게 이것은 운영 알림을 영향을 미치는 아키텍처의 맥락에 배치합니다 — 어떤 서비스가 실제로 불타고 있는지 파악하기 위해 PagerDuty와 시스템 다이어그램 사이를 오갈 필요가 없습니다.

각 제품은 여러 위젯 유형을 지원합니다 — 카운터, 상태 배지, 목록, 시계열 그래프, 임베디드 iframe — 데이터에 맞는 시각화를 선택할 수 있습니다.

작동 방식

시스템은 세 가지 계층으로 이루어져 있습니다:

연결은 조직 수준에 있습니다. 관리자가 자격 증명(API 키, 토큰, 서버 URL)을 제공하여 연결을 만듭니다. 하나의 연결로 조직의 모든 프로젝트에서 위젯에 전력을 공급할 수 있습니다. 같은 제품에 여러 연결을 만들 수 있습니다 — 예를 들어, 프로덕션 Datadog 계정과 스테이징용으로 하나씩.

위젯은 프로젝트 수준(또는 요소 수준, 또는 조직 수준)에 있습니다. 연결을 선택하고, 위젯 유형을 선택하고, 쿼리를 구성하여 위젯을 추가합니다. GitHub "오픈 풀 리퀘스트" 위젯은 소유자와 리포지토리 이름이 필요합니다. Prometheus "범위 쿼리" 위젯은 PromQL 표현식과 시간 범위가 필요합니다. SonarQube "퀄리티 게이트" 위젯은 프로젝트 키가 필요합니다.

그리드는 위젯이 시각적으로 존재하는 곳입니다. 이름이 붙은 섹션이 있는 12열 드래그 앤 드롭 레이아웃입니다. "모니터링", "보안", "CI/CD" 같은 섹션을 만들고, 접고, 재정렬하고, 개별 위젯의 크기를 조정할 수 있습니다. 모든 것이 자동 저장됩니다.

일반적인 위젯 설정은 약 30초 걸립니다. 연결 선택, 유형 선택, 구성 붙여넣기, 완료. 위젯이 즉시 데이터를 가져오기 시작합니다.

왜 대시보드가 아닌 위젯인가

전통적인 대시보드 제품을 만들 수도 있었습니다. 차트 행, 필터 사이드바, 평소의 것들.

하지 않았습니다. 이미 존재하기 때문입니다. Datadog에는 대시보드가 있습니다. Grafana에는 대시보드가 있습니다. 또 다른 대시보드 도구는 필요하지 않습니다. 필요한 것은 올바른 데이터를 올바른 맥락에서 보는 방법입니다 — 그리고 맥락은 아키텍처입니다.

열 개 서비스의 CPU 메트릭을 보여주는 Grafana 대시보드는 유용합니다. 하지만 어떤 서비스가 API 게이트웨이이고, 어떤 것이 결제 프로세서이며, 어떤 것이 알림 시스템인지는 알려주지 않습니다. 아키텍처 다이어그램은 알려줍니다. CPU 메트릭을 아키텍처 위에, 속한 컨테이너 옆에 놓으면 직접 멘탈 매핑을 할 필요가 없습니다.

이것은 Archyl에서 만드는 모든 것의 기본 원칙입니다: 아키텍처 문서는 시스템을 이해하기 위해 가는 단일 장소여야 합니다. 구조뿐만 아니라 — 결정(ADR), 사양(API Contracts), 배포 이력(Releases), 그리고 이제 운영 현실(마켓플레이스 통합).

섹션과 구성

처음부터 위젯의 평평한 벽은 확장되지 않을 것임을 알았습니다. 프로젝트에 15개의 위젯이 있을 때 — 모니터링용, 보안용, CI/CD용 — 구조가 필요합니다.

위젯은 이름이 붙은 섹션으로 구성됩니다. 만들고, 이름 짓고, 헤더를 드래그하여 재정렬하고, 지금 필요 없는 것은 접습니다. 각 섹션은 열고 닫을 수 있는 패널처럼 작동합니다.

편집 모드에서 다음을 할 수 있습니다:

  • 위젯을 드래그하여 섹션 내에서 위치 변경
  • 섹션 간 위젯 이동
  • 컴팩트 배지에서 전체 너비 차트까지 위젯 크기 조정
  • 섹션 헤더를 드래그하여 전체 그룹 재정렬
  • 섹션 생성, 이름 변경, 삭제

그리드는 수직으로 압축되므로 빈 공간이 없습니다. 정리를 마치면 "완료"를 클릭하고 레이아웃이 고정됩니다.

범위: 조직, 프로젝트, 요소

모든 데이터가 같은 수준에 속하는 것은 아닙니다.

조직 전체 위젯은 모든 프로젝트에서 볼 수 있습니다. 전역적으로 중요한 메트릭에 사용하세요 — 총 배포 수, 회사 전체 SonarQube 퀄리티 게이트 상태, 조직 수준 GitHub 보안 발견 사항.

프로젝트 범위 위젯은 특정 프로젝트의 통합 탭에만 나타납니다. 가장 일반적입니다 — 모니터링 대시보드, CI/CD 상태, 해당 프로젝트 서비스의 코드 품질 메트릭.

요소 범위 위젯은 C4 요소에 직접 부착됩니다. 컨테이너의 세부 패널을 열면 관계, ADR, API 계약과 함께 위젯을 볼 수 있습니다. 이것이 가장 강력한 범위입니다: 속한 아키텍처 요소에 맥락화된 운영 데이터.

이것이 바꾸는 것

마켓플레이스 통합 이전에는, 시스템의 운영 상태를 이해하려면 여러 도구를 열고, 데이터를 교차 참조하며, "모니터링 대시보드"와 "아키텍처 다이어그램" 사이의 매핑을 머릿속에 유지해야 했습니다.

이후: 하나의 작업 공간을 엽니다. 아키텍처가 무엇이 존재하는지 알려줍니다. 위젯이 어떻게 운영되는지 알려줍니다. 릴리스가 무엇이 배포되었는지 알려줍니다. ADR이 왜 그렇게 만들어졌는지 알려줍니다. API 계약이 인터페이스가 어떤 모습인지 알려줍니다.

한 곳. 하나의 맥락. 탭 전환 없음.

이것이 첫날부터 구축해 온 비전입니다. 실제 질문에 답하는 아키텍처 문서 — "이 시스템이 무엇인가?"뿐만 아니라 "이 시스템은 건강한가?", "이 서비스는 안전한가?", "마지막 배포는 언제였나?", "이 코드의 퀄리티 게이트 상태는?"

마켓플레이스 통합은 그 비전을 향한 큰 발걸음입니다. 그리고 이제 막 시작입니다 — 더 많은 제품이 올 예정입니다.

시작하기

  1. 조직 설정 > 마켓플레이스로 이동
  2. 제품 연결 (API 키 또는 토큰 필요)
  3. 어떤 프로젝트든 통합 탭 열기
  4. 커스터마이즈 클릭, 그 다음 위젯 추가
  5. 연결 선택, 위젯 유형 선택, 구성, 완료

전체 설정은 5분 이내로 걸립니다. 아키텍처 다이어그램이 다시는 같지 않을 것입니다.

다른 기능이 아키텍처에 생명을 불어넣는 방법을 보고 싶으신가요? 배포 추적은 릴리스 관리를, API 사양을 다이어그램에 연결하려면 API Contracts를 확인하세요.