tgoop.com/srv_admin/4643
Last Update:
Ранее я упоминал про различные движки, которые позволяют описывать диаграммы кодом. Они все собраны на сайте kroki.io, где их удобно оценить по визуальному оформлению и попробовать на готовых примерах что-то нарисовать.
Для движков с этого сайта есть расширение для VSCode - Markdown Kroki. С его помощью удобно рисовать схемы, так как тут же в соседнем окне можно открыть preview в режиме реального времени. Я попробовал, как это работает на наиболее актуальном по моему мнению движку для рисования схем сети - nwdiag.
Удобство такого подхода в том, что схема и все её изменения можно хранить в git репозитории. Я сделал для этого тестовый репо в gitflic, установил расширение, создал в репозитории файл в формате .md. Начал рисовать схему сети. Что получилось, можно посмотреть в репозитории или ниже на картинке. Попробовал основные возможности по оформлению.
Впечатления о nwdiag следующие. Это простой движок разметки. Не нужно ничего учить, можно сразу брать и делать. Я даже документацию не смог к нему найти. Есть ли она вообще? Просто посмотрел готовые примеры и начал пробовать.
Из-за его простоты ограничены возможности. Например, нельзя указать цвет фона. Из-за этого пришлось изменить тему VSCode с тёмной на светлую, иначе на тёмном фоне не видно чёрный шрифт, для которого тоже нельзя изменить ни размер, ни цвет. Это возможно только при экспорте в формат SVG. Там уже можно свои стили использовать.
Также нельзя задать координаты элементов, как-то подвигать их. Они отображаются в том порядке, как описаны в коде. Для маленьких схем некритично, а вот в больших захочется как-то скомпоновать элементы для наглядного представления, но не получится. Придётся изменением порядка в описании пытаться что-то изобразить.
Расширение только отображает схему в preview. Экспорт в картинку не делает, так что не получится её положить рядом с кодом. Смотреть придётся в редакторе или делать простенький пайплайн, создавай картинку на каком-то своём сервер с загрузкой в репозиторий.
Nwdiag можно установить через pip:# pip install nwdiag
И потом из кода рисовать картинки:# nwdiag diagram.diag
При коммите нужно будет забрать код md файла, обрезать первую и последнюю строки, где указан тип движка для расширения. То есть убрать нужно строки:```nwdiag
и ```
А потом уже рисовать картинку через nwdiag. Можно там же и некоторую красоту навести, например, сразу изменяя шрифт:# nwdiag -f /usr/share/fonts/truetype/ttf-dejavu/DejaVuSerif.ttf diagram.diag
Из подобных сервисов есть Graphviz и Mermaid, но они более сложные в освоении и без акцента на сети. Там нужно будет заморочиться, чтобы оформить такую же наглядную схему сети, которая в nwdiag создаётся за 10 минут.
Ещё отдельно напомню, что схемы, нарисованные вручную в excalidraw тоже могут храниться в git репозитории и автоматически рендериться в картинки, на которые можно указывать ссылки в различных документах.
❗️Если заметка вам полезна, не забудьте 👍 и забрать в закладки.
#схемы
BY ServerAdmin.ru
Share with your friend now:
tgoop.com/srv_admin/4643