Overview
What the Diagram Maker is and how it works
Диаграмма жасаушы дегеніміз не?
Диаграмма жасаушы — Datro DSL негізінде құрастырылған мәтіндік бірінші архитектуралық диаграмма құру құралы — бағдарламалық жүйелерді суреттер емес, деректер ретінде сипаттауға арналған құрылымдық, расталған және канондық пішімделген тіл.
Кенепте өрістерді сүйреп апарудың орнына .dtro файлын жазасыз. Құралдар тізбегі оны талдайды, архитектуралық ережелерді тексереді, WCAG контраст арақатынастарын бекітеді және оны SVG, PNG немесе интерактивті JSON форматында көрсетеді — барлығы бір ақиқат көзінен.
Бірнеше минут ішінде бірінші диаграммаңызды жазыңыз, растаңыз және көрсетіңіз.
Неліктен Datro Mermaid немесе draw.io арқылы?
- Терілген түйіндер — 23 семантикалық түрі (
service,database,gateway,queue, …) автоматты түрде дәйекті, пішінді түзететін диаграммаларды жасайды. - Терілген жиектер — 21 семантикалық түр (
http,query,publish,grpc, …) қолмен қайта анықтаусыз қосылымдарды түс коды және мәнері. - Архитектуралық шектеулер —
database !-> externalсияқты ережелерді жазыңыз және валидатор оларды қарау уақытында емес, талдау уақытында орындайды. - Каноникалық пішімдеуші —
datro fmtәрбір файлды детерминирленген пішімге қайта жазады; diff шуды қайта пішімдеу емес, нақты өзгерістерді көрсетеді. - Импорттау және құрастыру — үлкен диаграммаларды
importкөмегімен файлдарға бөлу, аттар кеңістігін бүркеншіктеу және ақ тізімдерді көрсету. - WCAG 2.1 қолжетімділігі — контраст коэффициенттері тақырып палитрасымен автоматты түрде тексеріледі;
W602АА-дан төмен түскенде жанады. - Машинада оқылатын JSON IR — әрбір диаграмма кез келген құралдар тізбегі, CI жүйесі немесе пайдаланушы рендерері арқылы шығынсыз тұтынылатын JSON IR экспорттайды.
Құралдар тізбегі қалай жұмыс істейді
Әрбір .dtro файл диаграммаға айналмас бұрын төрт кезеңнен өтеді:
- Parse — рекурсивті-түсіру лексикасы + талдаушы бастапқы мәтінді
DatroIRнысанына түрлендіреді. Ол ешқашан лақтырмайды; барлық мәселелер нақты сызық/баған орындарыменDiagnostic[]ретінде қайтарылады. - Тексеру — 4 өту: құрылымдық тұтастық → семантикалық шектеулерді тексеру → ақпарат туралы кеңестер → WCAG 2.1 контраст және жапсырма ұзындығына қолжетімділік.
- Экспорт — тексерілген IR DOT (Graphviz), Cytoscape.js JSON немесе жоғалтпайтын JSON IR түрлендіріледі.
- Render — DOT шығысы SVG немесе PNG пиксельді тамаша шығару үшін Graphviz бағдарламасына жіберіледі.
Толық мысал
Бұл .dtro файл топтары, терілген түйіндері, семантикалық жиектері, шектеу ережесі, орналасу кеңестері және WCAG тексерілген түс тақырыбы бар төлем қызметін анықтайды — барлығы бір файлда:
#!DATRO 1.0
meta {
title: "Payment Service"
version: "2.0.0"
owner: "payments-team"
sla: "99.95%"
}
group data {
label: "Data Layer"
members: [payments_db, fraud_cache]
}
node api_gw { type: gateway label: "API Gateway" }
node payment_svc { type: service label: "Payment Service" attrs { tech: "nestjs" } }
node payments_db { type: database label: "Payments DB" attrs { tech: "postgres" } }
node fraud_cache { type: cache label: "Fraud Cache" attrs { tech: "redis" } }
node stripe { type: external label: "Stripe" }
edge api_gw -> payment_svc { kind: http label: "POST /charge" }
edge payment_svc -> payments_db { kind: query }
edge payment_svc -> fraud_cache { kind: read }
edge payment_svc -> stripe { kind: http label: "charge API" }
constraint {
id: "no-db-external"
rule: "database !-> external"
message: "Databases must not call external APIs"
severity: error
}
layout { direction: LR algo: dagre }
theme {
palette { gateway: "#FFD0D0" service: "#D0E8FF" database: "#FFE8C0" cache: "#C0FFE8" }
accessibility { min_contrast: AA }
}Қазір көріңіз
Жоғарыдағы мысалды Диаграмма жасаушы редакторына қойып, Тексеру түймешігін басыңыз — сіз жол нөмірлері бар терілген диагностиканы көресіз, содан кейін бір рет басу арқылы SVG-ге көрсетіңіз.
Функцияның қысқаша мазмұны
Бірінші диаграмманы жазу үшін Quick Start бөліміне өтіңіз немесе толық синтаксис үшін тікелей Language Reference-ге өтіңіз.