아키텍처 다이어그램 생성기
텍스트로 시스템 설계를 스케치하세요. Mermaid 부그래프를 사용하여 서비스를 계층으로 그룹화합니다. 클라이언트, API, 데이터 저장소, 큐를 만들고, 설계 문서용 깔끔한 아키텍처 다이어그램을 렌더링하세요. 아무것도 브라우저를 떠나지 않습니다.
One step per line. Indent two spaces to branch beneath the line above.
리포지토리에 있는 시스템 설계
아키텍처 다이어그램은 설계 도구의 바이너리 파일이 되는 순간 드리프트됩니다. Mermaid로 작성하면 코드 옆에 유지됩니다. 각 계층을 부그래프로 그룹화하고, 데이터 저장소에는 실린더를 사용하고, 버스에는 육각형을 사용하면, 다이어그램은 검토 중에 한 줄 편집으로 업데이트됩니다.
또한 RFC 또는 온보딩 문서를 위한 올바른 아티팩트입니다. 검토자는 별도의 앱을 열지 않고도 구성 요소와 데이터 흐름을 봅니다.
워크플로우에서 다이어그램으로
자동화를 문서화하는 경우(예: n8n 또는 Zapier 파이프라인이 서비스 간에 데이터를 이동할 때), 아키텍처 다이어그램이 움직이는 부품을 명확하게 합니다. 트리거, 접촉하는 서비스, 데이터 着지를 스케치한 후 문서에 소스를 유지하여 흐름과 함께 진화합니다.
자주 묻는 질문
텍스트에서 소프트웨어 아키텍처 다이어그램을 어떻게 만들나요?
Mermaid 플로우차트를 사용하고, "subgraph Tier … end"로 관련 서비스를 그룹화하고, 화살표로 연결하세요. "[(DB)]"를 사용하여 데이터 저장소를 표현합니다. 실시간으로 렌더링되고 SVG 또는 PNG로 내보냅니다.
서비스를 계층으로 어떻게 그룹화하나요?
"subgraph Name … end"로 래핑하세요. 각 부그래프는 레이블이 지정된 상자가 되고, 이는 프레젠테이션/애플리케이션/데이터 분할 또는 마이크로서비스 세트를 표시하는 가장 명확한 방법입니다.
비동기 또는 큐 링크를 표시할 수 있나요?
네, 점선 링크(레이블 포함), 예: "A -. async .-> B"를 사용하여 이벤트 및 큐를 동기 호출과 구별합니다.
내 아키텍처 다이어그램이 개인정보 보호되나요?
네. 브라우저에서 완전히 렌더링되므로 내부 서비스 이름과 토폴로지가 기기를 떠나지 않습니다.
데이터베이스 및 큐에 어떤 모양을 사용해야 하나요?
데이터베이스 원통에 "[(name)]"를 사용하고, 큐/서브루틴에 "[[name]]"을 사용하고, 이벤트 버스와 같은 육각형에 "{{name}}"을 사용하세요. 치트시트 위에 나열되어 있습니다.