Úvod

erd-editor je editor diagramov entít a vzťahov. Je k dispozícii ako webová aplikácia, aplikácia pre Google Drive, rozšírenie pre VS Code, doplnok pre IntelliJ, doplnok pre Obsidian a ako vlastný element <erd-editor>, ktorý môžete vložiť do vlastnej stránky, s elementom <erd-viewer> vedľa neho na zobrazenie diagramu iba na čítanie. Web, ktorý nenačítava žiadny vlastný skript, môže namiesto toho vložiť diagram iba na čítanie z erd-editor.io/embed. Vo všetkých je to ten istý editor a ten istý formát dokumentu.

Kde ho získať

Platforma	Inštalácia	Čo získate
Webová aplikácia	erd-editor.io	Inštalovateľná PWA, funguje offline, spolupráca v reálnom čase
Google Drive	Google Workspace Marketplace	Pridá ERD Editor do ponúk Open with a New v službe Drive a ukladá späť do toho istého súboru
VS Code	Marketplace	Otvára súbory .erd.json vo vlastnom editore
IntelliJ	JetBrains Marketplace	Ten istý editor pre IDE založené na IntelliJ
Obsidian	Community plugins	Otvára súbory .erd a .erd.json na karte v trezore, iba v desktopovej aplikácii
Vlastná stránka	npm install @dineug/erd-editor	Vlastný element <erd-editor> nezávislý od frameworkov a <erd-viewer>, ktorý zobrazuje diagram iba na čítanie – pozrite si stránky Inštalácia a ErdViewerElement
Ľubovoľný web	erd-editor.io/embed	Diagram iba na čítanie v prvku iframe z adresy URL dokumentu, bez kódu – pozrite si stránku Vkladanie
Programovací agenti	@dineug/erd-editor-mcp	Server MCP, pomocou ktorého môže Claude Code, Codex alebo iný klient upravovať diagram naživo vo VS Code, v IDE od JetBrains alebo v aplikácii Obsidian, alebo priamo v samotnom súbore

Ak si ho chcete vyskúšať v IDE, vytvorte prázdny súbor s príponou .erd.json a otvorte ho. V aplikácii Obsidian spustite z palety príkazov príkaz ERD Editor: Create new diagram alebo v prieskumníkovi súborov vyberte položku New ERD z kontextovej ponuky priečinka. Obe možnosti vytvoria prázdny súbor .erd a otvoria ho. V službe Google Drive vyberte New → More → ERD Editor a potom sa prihláste pomocou účtu Google. ERD Editor má prístup iba k súborom, ktoré pomocou neho vytvoríte alebo otvoríte. Vo webovej aplikácii, v službe Google Drive, vo VS Code, v IDE od JetBrains a v aplikácii Obsidian sa nový prázdny diagram otvorí na uvítacej obrazovke, ktorá ponúka prvé kroky: New Table, New Memo, Import, Command Palette a Shortcuts. Posúvanie, zmena priblíženia, prepínanie kariet a prepínanie Zobrazenia názvov ponechajú prázdny súbor nového diagramu nezmenený, pretože v novom diagrame sú zapnuté všetky zamknutia. Pozrite si časť Zamknutie. VS Code otvára súbor ERD ako text JSON v Source Control, Local History, Compare with Saved, pri kontrole úprav z chatu VS Code a od programovacích agentov, napríklad GitHub Copilot a Claude Code, a v zobrazeniach revízií rozšírení, napríklad GitLens, GitHub Pull Requests a Git Graph, takže zmena sa porovnáva riadok po riadku. Príkaz Reopen Editor With... zobrazí revíziu Git ako diagram iba na čítanie.

Po aktualizácii doplnku pre Obsidian reštartujte aplikáciu Obsidian: dovtedy si okno ponechá editor, ktorý načítala predchádzajúca verzia. Aktualizujte ERD Editor a balík @dineug/erd-editor-mcp všade, kde zdieľate diagramy. Verzia spred zavedenia karty Slovník alebo starší server MCP, ktorý upravuje súbor na disku, uloží diagram bez jeho logických názvov, prepojení s doménami a slovníkov. Verzia z obdobia pred zavedením skupín tabuliek navyše nezobrazuje v súbore uloženom aktuálnou verziou ikony primárnych kľúčov a uložením súboru v nej sa stratia jeho skupiny tabuliek a skripty karty Schéma SQL. Súbor, ktorý uložila staršia verzia, sa prepíše do aktuálnej podoby pri prvej zmene, ktorá sa zapíše do súboru – pozrite si časť Zamknutie. Toto uloženie zároveň vynechá prázdne texty, zoznamy a kolekcie, ktoré staršia verzia zapísala, takže zmení väčšiu časť súboru než samotná úprava. Dovtedy editor JSON, ktorý overuje súbor z verzie spred zavedenia skupín tabuliek podľa jeho $schema, tento súbor hlási ako neplatný.

Čo dokáže

• Kreslite tabuľky, stĺpce a poznámky na neohraničenom plátne a spájajte ich pomocou štyroch typov vzťahov: Zero One, Zero N, One Only, One N. Pozrite si stránku Začíname s úpravami. Indexy sa definujú v paneli vlastností tabuľky. Jedinečný index nad dvoma alebo viacerými stĺpcami je alternatívny kľúč a so zapnutou možnosťou zobrazenia Alternate Key diagram označí jeho stĺpce ako AK1.1, AK1.2 a tak ďalej. Pozrite si časti Indexy a Alternatívne kľúče.
• Ukončite vzťah na stĺpcoch, ktoré tabuľka už má: kým ho kreslíte myšou alebo perom, tlačidlo Map to existing columns vedľa tabuľky, na ktorej vzťah končí, spáruje kľúč nadradenej tabuľky so stĺpcami tejto tabuľky a tlačidlo Create new columns pridá nové stĺpce. Položka Map Columns v kontextovej ponuke vzťahu slúži na neskoršiu zmenu jeho stĺpcov. Pozrite si časť Mapovať stĺpce. Vzťah môže mať aj akcie ON DELETE a ON UPDATE. Pozrite si časť ON DELETE a ON UPDATE.
• Upravujte rýchlo: Alt + N pridá tabuľku; Alt + Enter pridá stĺpec; Alt + K prepne primárny kľúč na stĺpci s fokusom alebo na každom vybratom stĺpci, ak je jedným z nich; a Delete alebo Backspace odstráni výber. Každá z týchto akcií je jeden krok histórie zmien. Pozrite si časť Klávesové skratky. Tabuľku alebo poznámku pridá jedným kliknutím aj panel nástrojov plátna v dolnej časti plátna.
• Nastavte farbu tabuľky, poznámky alebo skupiny tabuliek vo výbere farby s prednastavenými farbami a farbami, ktoré diagram už používa, a farbu odstráňte pomocou možnosti No color alebo Remove color. Pozrite si časť Nastavenie farby tabuliek a poznámok.
• Zoskupte súvisiace tabuľky do skupín tabuliek: skupina je rámec za tabuľkami, ktorému môžete nastaviť názov a farbu. Nakreslite ju pomocou Alt + G alebo pomocou New Table Group z kontextovej ponuky plátna, z panela nástrojov plátna alebo z rýchleho vyhľadávania, prípadne ju vytvorte z vybratých tabuliek pomocou T a potom G alebo položky Group selected tables v ich kontextovej ponuke. Tabuľka sa pridá do skupiny, keď ju pustíte dovnútra, a odoberie sa z nej, keď ju pustíte mimo skupiny. Keď skupinu presuniete myšou za jej záhlavie, presunú sa s ňou aj jej tabuľky. DBML prenáša skupiny v oboch smeroch ako bloky TableGroup.
• Priraďte tabuľkám a stĺpcom logické názvy, teda názvy, ktoré čítajú ľudia, napríklad Customer Name pre CUST_NM, popri fyzických názvoch, ktoré zapisujú karty Schéma SQL a Generátor kódu. Zobrazenie názvov (Physical Names, Logical Names alebo Both Names) určuje, ktoré z nich plátno vykresľuje, a riadi sa ním aj väčšina ďalších miest, ktoré uvádzajú názov tabuľky alebo stĺpca, napríklad riadky tabuliek a stĺpcov v prieskumníkovi, režim Flow a exportovaný obrázok. Vyberte ho tlačidlom Name View na paneli nástrojov plátna, v kontextovej ponuke plátna, na paneli nástrojov karty Vizualizácia v režime Flow alebo v rýchlom vyhľadávaní.
• Uchovávajte štandard pomenovania diagramu na karte Slovník. V jej hárkoch Domains, Words a Terms sa vyhľadáva, zoraďuje a upravuje ako v tabuľkovom procesore, pričom každý hárok má vlastnú históriu zmien. Hárky importujú a exportujú súbory CSV: import načíta vlastnú štruktúru súboru editora alebo štruktúru kórejského štandardu verejných údajov v kódovaní UTF-8 alebo EUC-KR a export zapisuje vlastnú štruktúru editora. Bunka logického názvu dopĺňa názvy termínov. Logický názov dá svojej tabuľke alebo stĺpcu fyzický názov zo zodpovedajúceho termínu alebo zo skratiek slov, na ktoré sa rozdelí, kým názov nezapíšete sami. Po zmene slova alebo termínu príkaz Derive Physical Names Again znova odvodí názvy vrátane tých, ktoré ste zapísali sami. Stĺpec prepojený s doménou, ručne alebo prostredníctvom svojho termínu, preberá typ údajov domény a riadi sa jej zmenami a možnosť zobrazenia Domain zobrazuje doménu každého stĺpca. Hárok Checks uvádza zakázané, neregistrované a synonymické slová, duplicitné názvy, neznáme domény, fyzické názvy, ktoré sa líšia od názvu ich termínu, a typy stĺpcov, ktoré sa líšia od typu ich domény. Plátno zafarbí logické a fyzické názvy, ktoré nahlásia kontroly slov a termínov.
• Importujte existujúcu schému z formátu json, Schema SQL, GraphQL, DBML alebo AML. Pozrite si stránku Import a export súborov. Súbor Schéma SQL, GraphQL, DBML alebo AML sa načíta s tabuľkami rozmiestnenými pozdĺž ich vzťahov alebo do riadkov, ak žiadne vzťahy nemá. Položka Import and Add pridá súbor pod diagram namiesto toho, aby ho nahradila.
• Exportujte diagram ako json; ako schému SQL z karty Schéma SQL, uložením do súboru .sql alebo skopírovaním; alebo z dialógového okna Export image ako obrázok PNG alebo SVG, prípadne ako PNG do schránky.
• Zobrazte diagram iba na čítanie na inom webe: vložte erd-editor.io/embed s adresou URL súboru, aj súboru na GitHube, alebo načítajte element <erd-viewer> na vlastnej stránke. Čitateľ diagram posúva, približuje, vyhľadáva v ňom a zvýrazňuje vzťahy, no nič ho neupravuje.
• Vytvárajte schému SQL v syntaxi ôsmich databázových systémov: Databricks, MSSQL, MariaDB, MySQL, Oracle, PostgreSQL, Snowflake a SQLite. Pozrite si stránku Funkcie pre tabuľky. Panel možností karty Schéma SQL určuje príkazy, hlavičku a skupiny tabuliek, ktoré sa majú zapísať, dokáže zapisovať logické názvy do prázdnych komentárov a uchováva váš vlastný kód SQL uložený v diagrame, ktorý sa zapíše pred tabuľky a za ne.
• Generujte kód pre dvadsaťdva cieľov: jazyky C#, Go, Java, Kotlin, PHP, Rust, Scala, Swift a TypeScript; nástroje ORM Doctrine, Drizzle, JPA, SeaORM, Sequelize, SQLAlchemy a TypeORM; a AML, DBML, GraphQL, JSON Schema, Mermaid a Zod. Panel možností karty Generátor kódu určuje jazyk, databázu a štýly názvov a kód sa uloží ako súbor s príponou daného jazyka alebo sa skopíruje. Pozrite si stránku Generátor kódu.
• Čítajte schému na karte Vizualizácia ako silovo riadený graf Graph alebo ako Flow z kartičiek tabuliek rozmiestnených pozdĺž ich vzťahov, kde podržanie ukazovateľa nad tabuľkou zvýrazní všetko, s čím je prepojená. Stlačte Alt + F na karte ERD, ak sa chcete zamerať na vybraté tabuľky a tabuľky, ktoré s nimi súvisia. V režime Flow tlačidlá Previous table a Next table robia krok späť a krok dopredu v tom, na čo bol režim Flow zúžený, rovnako ako tam klávesy vrátenia späť a opätovného vykonania.
• Pracujte na plátne bez okrajov: posúvajte zobrazenie všade, kam diagram siaha, meňte priblíženie od 10% do 150% pomocou Ctrl + Wheel (⌘ + Wheel na Macu), klávesnice alebo gesta stiahnutia prstov a v režime Zen skryte všetko okrem diagramu. Ťahanie stredným tlačidlom myši posúva zobrazenie z ľubovoľného miesta na plátne, aj nad tabuľkou. Pozrite si časť Pohyb po plátne.
• Usporiadajte celý diagram jedným krokom pomocou automatického rozloženia: silová simulácia, tok zľava doprava alebo strom v ktoromkoľvek z dvoch smerov, pričom každá skupina tabuliek zostane pohromade.
• Spustite príkaz odkiaľkoľvek pomocou rýchleho vyhľadávania alebo začnite hľadanie znakom #, @ alebo :, ak chcete prejsť na tabuľku, stĺpec alebo komentár či poznámku; # a @ nájdu aj logické názvy. Prechádzajte históriou úprav krok po kroku pomocou funkcií Vrátiť späť, znova vykonať, prehrajte históriu tejto relácie na plátne pomocou cestovania v čase alebo porovnajte diagram s iným súborom .json v prehliadači rozdielov. Jeho strom, umiestnený vedľa oboch verzií, uvádza tabuľky, stĺpce, indexy, cudzie kľúče, poznámky a skupiny tabuliek, ktoré boli pridané, zmenené, odstránené alebo premenované.
• Prezerajte si diagram v prieskumníkovi, strome ukotvenom pri ľavom okraji plátna: tabuľky, každá so svojimi stĺpcami, indexmi a cudzími kľúčmi, potom skupiny tabuliek a poznámky. Kliknutím na riadok prejdete na plátne na to, čo daný riadok predstavuje; riadok cudzieho kľúča zvýrazní aj svoj vzťah. Tlačidlo Explorer na paneli nástrojov vedľa tlačidla Search ho otvára a zatvára.
• Hľadajte text pomocou hľadania a nahrádzania v hornej časti prieskumníka. Prehľadáva názvy tabuliek, stĺpcov, indexov a skupín tabuliek, logické názvy tabuliek a stĺpcov a po zapnutí aj komentáre a poznámky, a zhody zobrazuje v strome prieskumníka. Nahraďte jednu zhodu alebo všetky; možnosť Preserve Case zachová pri každom nahradení veľkosť písmen nahrádzaného textu. Klávesová skratka Ctrl + F (⌘ + F na Macu) otvorí prieskumník s textovým kurzorom v poli hľadania a jej opätovné stlačenie prieskumník zatvorí.
• Používajte editor v 25 jazykoch, ktoré vyberiete tlačidlom Display Language na paneli nástrojov alebo v rýchlom vyhľadávaní. Možnosť System sa riadi jazykom prehliadača alebo hostiteľskej aplikácie a pri arabčine, hebrejčine a perzštine sa editor rozloží sprava doľava, pričom diagram zostane zľava doprava. Mení sa iba vlastný text editora: názvy, SQL a vygenerovaný kód zostávajú tak, ako boli napísané. Výber motívu na paneli nástrojov určuje vzhľad (System, Light alebo Dark), odtieň sivej a farbu zvýraznenia. Pozrite si stránku Jazyk a motív.
• Udržujte rozdiely v súbore čisté: poloha zobrazenia a priblíženie, otvorená karta, jazyk a štýly názvov na karte Generátor kódu, typ úvodzoviek a Zobrazenie názvov sú predvolene zamknuté, takže súbor si ponechá hodnoty, ktoré tieto nastavenia mali v čase zamknutia, a posúvanie, zmena priblíženia, prepínanie kariet ani prepínanie Zobrazenia názvov ho nikdy nezmení. Súbor sa zapisuje v pevnom poradí, s jedným riadkom pre každý riadok slovníka, a vynecháva namerané šírky, poradie prekrývania, body ukotvenia spojníc, odstránené objekty, prázdne texty objektov a zoznamy a kolekcie objektov, ktoré diagram vôbec neobsahuje, takže ak diagram otvoríte a zatvoríte bez úpravy, súbor zostane taký, aký bol.
• Nechajte programovacieho agenta, napríklad Claude Code alebo Codex, upravovať diagram prostredníctvom servera MCP: naživo vo VS Code, v aplikácii Obsidian alebo v IDE od JetBrains, kde sa každá zmena zobrazí na plátne hneď, ako nastane, alebo priamo v samotnom súbore. Dokáže tiež nastavovať logické názvy a domény stĺpcov, upravovať slovníky, znova odvodzovať fyzické názvy a vypisovať, čo zisťuje hárok Checks.
• Upravujte spoločne v reálnom čase vo webovej aplikácii (experimentálne). Relácie sú peer-to-peer a šifrované end-to-end, takže vašu schému neuchováva žiadny server a účastníci navzájom vidia svoje kurzory, fokus a výbery. Na vlastnej stránke vám metóda getSharedStore() poskytne ten istý prúd akcií cez prenos, ktorý si zvolíte, a balík @dineug/erd-editor-yjs udržiava diagram v súlade prostredníctvom dokumentu Yjs a ľubovoľného poskytovateľa, ktorý ho prenáša, vrátane úprav offline a prítomnosti.

Začnite príručkou k úpravám.

Prečo vznikol tento projekt

Existujúce nástroje na modelovanie neposkytovali takú úroveň používateľského zážitku, akú som chcel.
Preto som začal tento projekt, aby som ponúkol najlepší možný používateľský zážitok.
Najvyššou prioritou projektu je používateľský zážitok pri úpravách.
Ponúkne vám ohromujúci zážitok z úprav.