الانتقال إلى المحتوى الرئيسي

مقدمة

erd-editor محرر لمخططات الكيانات والعلاقات. يتوفر على هيئة تطبيق ويب، وتطبيق Google Drive، وإضافة VS Code، ومكوّن IntelliJ الإضافي، ومكوّن Obsidian الإضافي، وعنصر مخصص <erd-editor> يمكنك تضمينه في صفحتك الخاصة. وهو محرر واحد وتنسيق مستند واحد في جميعها.

مخطط متجر: وضع المؤشر فوق علاقة، وإضافة عمود، والتركيز على orders في وضع التدفق

من أين تحصل عليه​

المنصةالتثبيتما تحصل عليه
تطبيق الويبerd-editor.ioتطبيق PWA قابل للتثبيت، يعمل دون اتصال، ويتيح التعاون في الوقت الفعلي
Google DriveGoogle Workspace Marketplaceيضيف ERD Editor إلى القائمتين Open with وNew في Drive، ويحفظ التغييرات في الملف نفسه
VS CodeMarketplaceيفتح ملفات .erd.json في محرر مخصص
IntelliJJetBrains Marketplaceالمحرر نفسه، لبيئات التطوير المبنية على IntelliJ
ObsidianCommunity pluginsيفتح ملفات .erd و.erd.json في علامة تبويب داخل الخزنة، على سطح المكتب فقط
صفحتك الخاصةnpm install @dineug/erd-editorالعنصر المخصص <erd-editor> المستقل عن أطر العمل، راجع التثبيت
وكلاء البرمجة@dineug/erd-editor-mcpخادم MCP يمكّن Claude Code أو Codex أو أي عميل آخر من تحرير مخطط تحريرًا مباشرًا في VS Code أو بيئة تطوير JetBrains أو Obsidian، أو في الملف نفسه

لتجربته في بيئة تطوير، أنشئ ملفًا فارغًا بالامتداد .erd.json وافتحه. في Obsidian، شغّل ERD Editor: Create new diagram من لوحة الأوامر، أو اختر New ERD من قائمة السياق لأحد المجلدات في مستكشف الملفات. ينشئ كلٌّ منهما ملف .erd فارغًا ويفتحه. في Google Drive، اختر New → More → ERD Editor، ثم سجّل الدخول باستخدام Google. لا يصل ERD Editor إلا إلى الملفات التي تنشئها أو تفتحها به. في تطبيق الويب وGoogle Drive وVS Code وبيئة تطوير JetBrains وObsidian، يُفتح المخطط الجديد الفارغ على شاشة الترحيب، وهي قائمة بالخطوات الأولى: New Table وNew Memo وImport وCommand Palette وShortcuts. يترك التمرير والتكبير والتصغير والتبديل بين علامات التبويب الملفَ الفارغ للمخطط الجديد كما هو، لأن كل الأقفال مفعّلة في المخطط الجديد. راجع القفل. يفتح VS Code ملف ERD كنص JSON في Source Control وLocal History وCompare with Saved، وفي مراجعة التعديلات في دردشة VS Code ولدى وكلاء البرمجة مثل GitHub Copilot وClaude Code، وفي عروض المراجعات في إضافات مثل GitLens وGitHub Pull Requests وGit Graph، فتظهر فروق التغيير سطرًا بسطر. ويعرض Reopen Editor With... مراجعة Git كمخطط للقراءة فقط.

بعد تحديث مكوّن Obsidian الإضافي، أعد تشغيل Obsidian: فحتى ذلك الحين، تحتفظ النافذة بالمحرر الذي حمّله الإصدار السابق. حدّث ERD Editor في كل مكان تشارك فيه المخططات: فالإصدار السابق لظهور مجموعات الجداول لا يعرض أيقونات المفتاح الأساسي في ملف حفظه الإصدار الحالي، وحفظ الملف هناك يُسقط منه مجموعات الجداول وسكربتات مخطط SQL. تُعاد كتابة الملف الذي حفظه إصدار كهذا بالصيغة الحالية عند أول تغيير يحتفظ به الملف، راجع القفل. وحتى ذلك الحين، يشير محرر JSON الذي يتحقق من صحته وفق $schema الخاص به إلى أنه غير صالح.

ما الذي يقدمه​

  • ارسم الجداول والأعمدة والملاحظات على لوحة رسم غير محدودة، واربطها بأربعة أنواع من العلاقات: Zero One وZero N وOne Only وOne N. راجع بدء التحرير. تُعرَّف الفهارس في لوحة خصائص الجدول. الفهرس الفريد الذي يشمل عمودين أو أكثر مفتاح بديل، وعند تفعيل خيار العرض Alternate Key، يعلّم المخطط أعمدة الفهرس بالعلامات AK1.1 وAK1.2 وهكذا. راجع الفهارس والمفاتيح البديلة.
  • أنهِ العلاقة على أعمدة موجودة بالفعل في الجدول: أثناء رسم علاقة بالماوس أو بالقلم، يقرن Map to existing columns، بجوار الجدول الذي تنتهي عنده، مفتاحَ الجدول الأصل بأعمدة ذلك الجدول، ويضيف Create new columns أعمدة جديدة. ويغيّر Map Columns في قائمة السياق للعلاقة أعمدتها لاحقًا. راجع تعيين الأعمدة. ويمكن أن تحمل العلاقة أيضًا إجراءات ON DELETE وON UPDATE. راجع ON DELETE وON UPDATE.
  • حرّر بسرعة: يضيف Alt + N جدولًا؛ ويضيف Alt + Enter عمودًا؛ ويبدّل Alt + K المفتاح الأساسي في العمود الذي عليه التركيز، أو في كل الأعمدة المحددة إذا كان ذلك العمود أحدها؛ ويحذف Delete أو Backspace التحديد. يمثل كلٌّ منها خطوة تراجع واحدة. راجع الاختصارات. ويضيف شريط أدوات لوحة الرسم أسفل لوحة الرسم جدولًا أو ملاحظة بنقرة واحدة أيضًا.
  • لوّن جدولًا أو ملاحظة أو مجموعة جداول من منتقي ألوان يضم ألوانًا معدّة مسبقًا والألوان التي يستخدمها المخطط بالفعل، وأزل اللون باستخدام No color أو Remove color. راجع تلوين الجداول والملاحظات.
  • اجمع الجداول المترابطة في مجموعات جداول: مربع خلفها يمكنك تسميته وتلوينه. ارسم مجموعة باستخدام Alt + G أو باستخدام New Table Group من قائمة السياق للوحة الرسم أو شريط أدوات لوحة الرسم أو البحث السريع، أو أنشئ مجموعة من الجداول المحددة باستخدام T ثم G أو Group selected tables في قائمة السياق الخاصة بها. ينضم الجدول إلى المجموعة حين تُفلته داخلها ويغادرها حين تُفلته خارجها، وسحب المجموعة من شريط عنوانها ينقل جداولها معها. ويحمل DBML المجموعات في كلا الاتجاهين، على هيئة كتل TableGroup.
  • استورد مخططًا موجودًا من json أو Schema SQL أو GraphQL أو DBML أو AML. راجع استيراد الملفات وتصديرها. تصل جداول ملف مخطط SQL أو GraphQL أو DBML أو AML مرتبةً على امتداد علاقاتها، أو في صفوف إن لم تكن فيه علاقات. ويضيف Import and Add ملفًا أسفل المخطط بدلًا من استبداله.
  • صدّر المخطط بصيغة json؛ أو بصيغة مخطط SQL من علامة تبويب مخطط SQL، محفوظًا في ملف .sql أو منسوخًا؛ أو من مربع الحوار Export image كصورة PNG أو SVG، أو كصورة PNG في الحافظة.
  • اكتب مخطط SQL بصياغة ثمانية أنظمة لقواعد البيانات: Databricks وMSSQL وMariaDB وMySQL وOracle وPostgreSQL وSnowflake وSQLite. راجع وظائف الجداول. تختار لوحة الخيارات في علامة تبويب مخطط SQL العبارات والترويسة ومجموعات الجداول التي تُكتب، وتحتفظ بنص SQL الخاص بك، محفوظًا في المخطط، ليُكتب قبل الجداول وبعدها.
  • أنشئ التعليمات البرمجية لأيٍّ من 22 هدفًا: اللغات C# وGo وJava وKotlin وPHP وRust وScala وSwift وTypeScript؛ وأطر ORM، وهي Doctrine وDrizzle وJPA وSeaORM وSequelize وSQLAlchemy وTypeORM؛ وكذلك AML وDBML وGraphQL وJSON Schema وMermaid وZod. تختار لوحة الخيارات في علامة تبويب منشئ التعليمات البرمجية اللغةَ وقاعدة البيانات وأنماط التسمية، وتُحفظ التعليمات البرمجية في ملف بامتداد اللغة أو تُنسخ. راجع منشئ التعليمات البرمجية.
  • اقرأ المخطط في التصور المرئي، على هيئة Graph موجّه بالقوى أو Flow من بطاقات الجداول المرتبة على امتداد علاقاتها، حيث يؤدي وضع المؤشر فوق جدول إلى إبراز كل ما يتصل به. اضغط Alt + F في علامة تبويب ERD للتركيز على الجداول المحددة والجداول المرتبطة بها.
  • اعمل على لوحة رسم بلا حواف: حرّك العرض إلى أي مكان يمتد إليه المخطط، وكبّر العرض وصغّره من 10% إلى 150% باستخدام Ctrl + Wheel (⌘ + Wheel على Mac) أو لوحة المفاتيح أو إيماءة القرص، وأخلِ الشاشة من كل شيء عدا المخطط باستخدام وضع الزن. يحرّك السحب بزر الماوس الأوسط العرض من أي مكان على لوحة الرسم، حتى من فوق جدول. راجع التنقل في لوحة الرسم.
  • رتّب مخططًا كاملًا في خطوة واحدة باستخدام التخطيط التلقائي: محاكاة قوى، أو تدفق من اليسار إلى اليمين، أو شجرة في أي من الاتجاهين، مع إبقاء كل مجموعة جداول مجتمعة.
  • شغّل أي أمر من أي مكان باستخدام البحث السريع، أو ابدأ البحث بالرمز # أو @ أو : للانتقال إلى جدول أو عمود أو تعليق أو ملاحظة. تنقّل خطوة بخطوة في سجل التعديلات باستخدام التراجع والإعادة، وأعد تشغيل سجل هذه الجلسة على لوحة الرسم باستخدام السفر عبر الزمن، أو قارن المخطط بملف .json آخر في عارض الفروق. وتسرد شجرته، بجوار النسختين، الجداول والأعمدة والفهارس والمفاتيح الخارجية والملاحظات ومجموعات الجداول التي أُضيفت أو عُدّلت أو حُذفت أو أُعيدت تسميتها.
  • تصفّح المخطط في المستكشف، وهو شجرة مثبّتة على يسار لوحة الرسم: الجداول، كلٌّ منها بأعمدته وفهارسه ومفاتيحه الخارجية، ثم مجموعات الجداول والملاحظات. انقر على صف للانتقال إلى ما يمثله على لوحة الرسم؛ ويُبرز صف المفتاح الخارجي علاقته أيضًا. يفتحه الزر Explorer في شريط الأدوات، بجوار Search، ويغلقه.
  • ابحث عن نص باستخدام البحث والاستبدال أعلى المستكشف. فهو يبحث في أسماء الجداول والأعمدة والفهارس ومجموعات الجداول، وفي التعليقات والملاحظات بعد تفعيلها، ويعرض التطابقات في شجرة المستكشف. استبدل تطابقًا واحدًا أو جميع التطابقات؛ ويمنح Preserve Case كل بديل حالة أحرف النص الذي يستبدله. يفتح Ctrl + F (⌘ + F على Mac) المستكشف ومؤشر الكتابة في حقل البحث، والضغط عليه مرة أخرى يغلق المستكشف.
  • استخدم المحرر بإحدى 25 لغة، تختارها من الزر Display Language في شريط الأدوات أو من البحث السريع. يتبع System لغة المتصفح أو التطبيق المضيف، وتعرض العربية والعبرية والفارسية المحرر من اليمين إلى اليسار بينما يبقى المخطط من اليسار إلى اليمين. لا يتغير إلا نص المحرر نفسه: تبقى الأسماء ونص SQL والتعليمات البرمجية المُنشأة كما كُتبت. ويختار منشئ النسق في شريط الأدوات المظهر (System أو Light أو Dark) ودرجة رمادي ولون تمييز. راجع اللغة والنسق.
  • حافظ على نظافة الفروق: موضع التمرير ومستوى التكبير، وعلامة التبويب المفتوحة، ولغة منشئ التعليمات البرمجية وأنماط التسمية فيه، ونوع علامات الاقتباس مقفلة افتراضيًا، لذا يحتفظ الملف بالقيم التي كانت لها عند قفلها، ولا يغيّره التمرير أو التكبير والتصغير أو التبديل بين علامات التبويب أبدًا. يُكتب الملف بترتيب ثابت ولا يتضمن العروض المقيسة ولا ترتيب التراص ولا نقاط ارتكاز خطوط الربط ولا العناصر المُزالة، لذا فإن فتح مخطط وإغلاقه دون تعديل يترك الملف كما كان.
  • دع وكيل برمجة مثل Claude Code أو Codex يحرّر المخطط عبر خادم MCP: تحريرًا مباشرًا في VS Code أو Obsidian أو بيئة تطوير JetBrains، حيث يظهر كل تغيير على لوحة الرسم لحظة حدوثه، أو في الملف نفسه.
  • حرّر مع الآخرين في الوقت الفعلي في تطبيق الويب (تجريبي). الجلسات من نظير إلى نظير ومشفّرة من طرف إلى طرف، لذا لا يحتفظ أي خادم بمخططك، ويرى النظراء مؤشرات بعضهم بعضًا وتركيزهم وتحديداتهم. وفي صفحتك الخاصة، تمنحك الدالة getSharedStore() دفق الإجراءات نفسه عبر وسيلة النقل التي تختارها.

ابدأ من دليل التحرير.

سبب إنشاء هذا المشروع​

لم تقدّم أدوات النمذجة الموجودة مستوى تجربة المستخدم الذي كنت أطمح إليه.
لذلك أنشأتُ هذا المشروع لتقديم تجربة مستخدم مُثلى.
الأولوية القصوى للمشروع هي تجربة التحرير لدى المستخدم.
سيقدّم لك تجربة تحرير مذهلة.