사용자가 배치 위치를 결정하는 다이어그램 언어 reladraw — AI 생성 일러스트
개발도구 도구

사용자가 배치 위치를 결정하는 다이어그램 언어 reladraw

Show HN: Reladraw – A diagram language where you decide where to place things

Hacker News9월 26일 발표 · 3분

텍스트 기반 다이어그램 언어 'reladraw'가 공개되었습니다. 이 도구는 사용자가 원하는 위치에 요소를 배치할 수 있도록 설계되어, 복잡한 구조도까지 코드로 작성하게 합니다.

세 줄 요약Hacker News 원문 기반
  1. 기존의 자동 레이아웃 툴(Mermaid 등)과 수동 편집 툴 사이의 간극을 메웠습니다. 노드 배치를 절대 좌표가 아닌 상대적인 관계로 지정하는 것이 핵심 기능입니다.
  2. 특정 레이아웃이나 아키텍처 구조가 중요한 경우, reladraw를 사용하면 복잡한 XML 수정 없이도 원하는 시각적 구성을 빠르고 정확하게 구현할 수 있습니다.
  3. 현재는 초기 개발 단계라 문법(Syntax)이 불안정하며 지속적인 변경이 예상됩니다. 따라서 안정적인 프로덕션 환경보다는 아이디어 구상 및 초안 작성에 활용하는 것을 권장합니다.

reladraw는 사용자가 요소의 배치를 직접 지정할 수 있는 텍스트 기반 다이어그램 언어입니다. 기존의 Mermaid, Graphviz 같은 도구들은 박스와 연결을 선언하면 위치를 자동으로 결정해주는 반면, draw.io나 Excalidraw 같은 도구는 절대적인 배치(absolute placement)가 가능하지만 수동으로 노드를 끌거나 복잡한 XML 코드를 수정해야 하는 비효율성이 있습니다.

reladraw는 이 두 극단 사이의 장점을 취합니다. 위치를 수동으로 지정할 필요 없이 상대적 관계(relative positions)로 배치할 수 있게 설계되었습니다. 예를 들어, 특정 노드의 아래나 오른쪽에 다른 요소를 배치하는 방식으로 구조도를 코드로 작성할 수 있습니다.

이 도구는 명령줄 인터페이스(CLI)를 통해 작동하며, `npm install -g reladraw` 명령어로 설치하여 `.reladraw` 텍스트 파일을 SVG로 변환할 수 있습니다. 또한, Claude Code나 Copilot 같은 가 reladraw 사용법을 알도록 스킬로 추가하는 기능도 제공합니다. 다만, 현재 버전은 초기 단계(Version 0.8.0)이며 문법(syntax)이 불안정하여 지속적인 변경이 예상되므로 참고해야 합니다.

용어 풀이

에이전트
목표를 받으면 스스로 계획을 세우고 도구를 써서 여러 단계의 작업을 해내는 AI.
원문Hacker News · Show HN: Reladraw – A diagram language where you decide where to place things
원문 보기Hacker News