Hackers' Pub에서는 글 안에 DOT 言語(Graphviz)로 다이어그램을 넣을 수 있습니다.
hackers.pub
Hackers' Pub에서 DOT 언어(Graphviz)로 다이어그램 그리기
Hackers' Pub의 숨겨진 기능 중 하나는 Graphviz의 DOT 언어를 지원한다는 것입니다. 예를 들어, 다음과 같은 다이어그램을 그릴 수 있습니다: SimpleActivityPub server_a 서버 A (Mastodon) server_b 서버 B (Hackers' Pub) server_a->server_b ActivityStreams 데이터 전송 (HTTP POST) server_b->server_a 응답 및 상호작용 (HTTP POST) Graphviz를 이용하는 법은 간단합니다. Markdown의 코드 블럭 문법 안에 DOT 언어로 다이어그램을 기술하신 뒤, 코드 블럭의 언어 태그에 graphviz를 붙이시면 됩니다. 위에서 예를 든 다이어그램은 Markdown에서 아래와 같이 쓰면 됩니다: ```graphviz digraph SimpleActivityPub { graph [rankdir=LR, fontname="sans-serif", bgcolor="white"]; node [fontname="sans-serif", shape=box, style="rounded,filled"]; edge [fontname="sans-serif"]; server_a [label="서버 A\n(Mastodon)", fillcolor="#AED6F1"]; server_b [label="서버 B\n(Hackers' Pub)", fillcolor="#A3E4D7"]; server_a -> server_b [label="ActivityStreams 데이터 전송\n(HTTP POST)", color="red"]; server_b -> server_a [label="응답 및 상호작용\n(HTTP POST)", color="blue"]; } ``` 참고로 Graphviz는 긴 게시글 뿐만 아니라 단문에서도 똑같이 지원합니다.
Hackers' Pub의 숨겨진 기능 중 하나는 Graphviz의 DOT 언어를 지원한다는 것입니다. 예를 들어, 다음과 같은 다이어그램을 그릴 수 있습니다:
Graphviz를 이용하는 법은 간단합니다. Markdown의 코드 블럭 문법 안에 DOT 언어로 다이어그램을 기술하신 뒤, 코드 블럭의 언어 태그에 graphviz를 붙이시면 됩니다. 위에서 예를 든 다이어그램은 Markdown에서 아래와 같이 쓰면 됩니다:
```graphviz
digraph SimpleActivityPub {
graph [rankdir=LR, fontname="sans-serif", bgcolor="white"];
node [fontname="sans-serif", shape=box, style="rounded,filled"];
edge [fontname="sans-serif"];
server_a [label="서버 A\n(Mastodon)", fillcolor="#AED6F1"];
server_b [label="서버 B\n(Hackers' Pub)", fillcolor="#A3E4D7"];
server_a -> server_b [label="ActivityStreams 데이터 전송\n(HTTP POST)", color="red"];
server_b -> server_a [label="응답 및 상호작용\n(HTTP POST)", color="blue"];
}
```
참고로 Graphviz는 긴 게시글 뿐만 아니라 단문에서도 똑같이 지원합니다.
graphviz.org
Graphviz
Please join the Graphviz forum to ask questions and discuss Graphviz. What is Graphviz? Graphviz is open source graph visualization software. Graph visualization is a way of representing structural information as diagrams of abstract graphs and networks. It has important applications in networking, bioinformatics, software engineering, database and web design, machine learning, and in visual interfaces for other technical domains.
