دوز مباشرة للمحتوى الرئيسي
دروس فالذكاء الاصطناعي

بني وشغّل مواقع ويب قابلة للتعديل مولّدة بالذكاء الاصطناعي مع EmDash Build

تعلّم كيفاش كيحوّل EmDash Build الموجزات لمواقع EmDash وAstro قابلة للتعديل، وكيفاش خدامة البنية ديالو مع Cloudflare، وكيفاش تهيّئو وتشغّلو محلياً. هاد الدليل كيغطي حتى طريقة خدمة الوكيل، وأوامر التحقّق، وحفظ المعطيات، وعناصر التحكّم فالنشر، واعتبارات الأمان، ونصائح عملية للتطوير.

بني وشغّل مواقع ويب قابلة للتعديل مولّدة بالذكاء الاصطناعي مع EmDash Build

شنو هو EmDash Build؟

EmDash Build هو منشئ مواقع بالذكاء الاصطناعي ومفتوح المصدر، كيحوّل وصف مكتوب لموقع EmDash قابل للتعديل. بلا ما ينشئ غير بنية ثابتة ديال الصفحات، كينشئ نموذج منظم للمحتوى، وكيعمّر هاد النموذج باستعمال خادم Model Context Protocol ديال EmDash، وكيكتب صفحات ومكوّنات Astro مكتوبة الأنواع باش يعرض المحتوى.

المشروع الناتج فيه صفحات كتترندر فالخادم، ومحتوى منظم، وتخزين الوسائط، وواجهة إدارة EmDash. المحررين يقدرو يبقاو كيستعملو الموقع من بعد التوليد الأولي: يقدرو يحدّثو النصوص والوسائط، يزيدو أو يكررو الأقسام، يعاودو يرتبو كتل المحتوى، يبرمجو المنشورات، ويطلبو من الوكيل يدير تغييرات أكبر فالمحتوى ولا التصميم.

مهم: EmDash Build هو تطبيق مرجعي فمرحلة ألفا، وموجّه لمزوّدي الاستضافة، وبناة المواقع، والمنصات. النشر معطّل فالعرض التجريبي المستضاف.

تقدر تستكشف العرض التجريبي المستضاف، ولكن ما تقدرش تنشر المواقع من خلالو.

الإمكانيات الرئيسية

  • توضيح منظم: الوكيل كيسول أسئلة مركزة ملي كيخلي الوصف قرار مهم بلا حسم.
  • نماذج محتوى كيصممها الوكيل: كينشئ مجموعات للكيانات القابلة لإعادة الاستعمال، وكتلا منظمة لأقسام الصفحات اللي يقدرو المحررين يعاودو يرتبوها.
  • مواقع Astro قابلة للتعديل: الواجهة الأمامية كتستعمل مكوّنات Astro مكتوبة الأنواع، بينما المحتوى العادي كيبقى قابل للإدارة من خلال EmDash.
  • معاينة مباشرة وإصلاح: المشروع كيتعرض فمعاينة خاصة ديال Builder. الوكيل يقدر يتحقق من النتيجة، يفحص الأعطاب، ويصلحها فالنفس الدورة.
  • سير عمل المحتوى: المحررين يقدرو يدبرو النصوص، والوسائط، والأقسام، والكتل، والمحتوى المبرمج من خلال واجهة إدارة EmDash.
  • سجل تاريخي دائم: الكود المصدري وحالة CMS المحلية كيتخزنو على شكل التزامات Git فـ Cloudflare Artifacts.
  • نشر متحكم فيه: الإصدارات الثابتة اللي تم التحقق منها تقدر تتحزم لـ Workers for Platforms، ولكن غير ملي المشغّل كيفعّل النشر وكيضبطو بشكل صريح.

كيفاش كتخدم البنية

كل مشروع مولّد كيتوصل بـ Cloudflare Sandbox فيه مشروع EmDash وAstro وTailwind واجد. كائن Durable Object سميتو BuilderAgent كيدبر المحادثة والدورة ديال النموذج والأدوات.

الوكيل كيستعمل أدوات EmDash MCP باش ينشئ المخططات والمحتوى. كيكتب الواجهة العامة داخل Sandbox، كيشغّل معاينة خاصة، كيتحقق من الموقع المترندر، وكيصلح الأخطاء قبل ما يكمل الدورة.

Cloudflare Artifacts كيخزن كل حالة متناسقة ديال المشروع فالتاريخ ديال Git. إلا دخل Sandbox فحالة السكون، يقدر EmDash Build يرجع الكود المصدري وحالة CMS المحلية لحاوية جديدة ويعاود يشغّل المعاينة.

سير عمل الوكيل

  1. الفهم: قرا الوصف وحدد القرارات المهمة اللي ناقصة.
  2. النمذجة: قرر شنو من البيانات خاصو يولي مجموعات قابلة لإعادة الاستعمال، وشنو من الصفحات محتاجة كتل منظمة.
  3. البناء: أنشئ مخطط EmDash، حدّث الأنواع المولدة، وكتب عارضات Astro مكتوبة الأنواع.
  4. التعمير: زِد محتوى ووسائط نموذجية باستعمال أدوات EmDash MCP.
  5. التحقق: دير فحص للأنواع فالمشروع، ورندر المسارات العامة، وفحص المعاينة، وصلح الأعطاب.
  6. الحفظ: سجّل الحالة الكاملة ديال المشروع فـ Cloudflare Artifacts.

المتطلبات المسبقة

التطوير المحلي كيعتمد على أدوات محلية وعلى الولوج لعدة خدمات ديال Cloudflare. قبل ما تكمل، وجد ما يلي:

  • Node.js 24 أو أحدث
  • pnpm 11.9
  • خدمة متوافقة مع Docker وخدامة
  • Wrangler موثّق فحساب Cloudflare
  • الولوج إلى Cloudflare Workers
  • الولوج إلى Durable Objects
  • الولوج إلى Cloudflare Sandbox
  • الولوج إلى Workers AI وAI Gateway
  • الولوج إلى Cloudflare Artifacts
  • الولوج إلى Workers for Platforms

حيت موارد المزوّد وحدود الثقة كيحتاجو إعداد دقيق، قرا دليل الاستضافة الذاتية ديال المستودع قبل ما تنشر التطبيق.

تثبيت وإعداد EmDash Build

1. تثبيت الاعتماديات

من جذر المستودع، ثبّت نسخ الاعتماديات المقفولة:

pnpm install --frozen-lockfile

2. إنشاء إعدادات المزوّد

نسخ provider.config.example.json للملف المتجاهَل provider.config.json:

cp provider.config.example.json provider.config.json

حلّ provider.config.json وبدّل كل قيمة نموذجية بالموارد ديال حسابك فـ Cloudflare. أنشئ الموارد المطلوبة باتباع دليل الاستضافة الذاتية، وما تعتمدش على القيم النموذجية.

3. التحقق من الإعدادات ورندرها

شغّل فحوصات ما قبل التشغيل، ومن بعد ولّد إعدادات Wrangler الخاصة بالمزوّد:

pnpm preflight
pnpm configure

ملف الإعدادات المولد اللي كيستعملو أمر التشغيل المحلي الموثق هو wrangler.provider.jsonc. فحص هاد الملف الخاص بالمزوّد قبل النشر أو تشغيل البيئات الحساسة.

4. إعداد الأسرار المحلية

نسخ قالب أسرار التطوير:

cp .dev.vars.example .dev.vars

زِد بيانات اعتماد AI Gateway المطلوبة من طرف المنشئ إلى .dev.vars. المتغير UNSPLASH_ACCESS_KEY اختياري؛ إضافتو كتفعّل البحث على الصور الجاهزة أثناء التوليد.

ما تحطّش بيانات اعتماد المزوّد داخل المشاريع المولدة. النشر كيتحكم فيه الخادم، والمواقع المولدة ما كيتعطاوش بيانات اعتماد المزوّد.

5. تشغيل التطبيق المحلي الكامل

بدا EmDash Build باستعمال إعداد المزوّد اللي تْولّد:

EMDASH_WRANGLER_CONFIG=wrangler.provider.jsonc pnpm dev

ملي يكون سيرفر التطوير واجد، حلّ http://localhost:5173.

6. بدا وضع الواجهة فقط فالحالات المناسبة

إلا كنت محتاج غير تخدم على الواجهة، استعمل:

pnpm dev:ui

هاد الوضع ما كيبداش توليد المواقع المعتمد على Sandbox. استعمل أمر التطوير الكامل ملي تحتاج تجرّب وكيل البناء، إنشاء المشاريع، ولا المعاينات المولّدة مباشرة.

الاستعمال الأساسي: ولّد موقع من وصف

1. كتب وصف مفيد

شرح الموقع اللي باغي، الجمهور ديالو، الصفحات الرئيسية، المحتوى القابل لإعادة الاستعمال، والاتجاه البصري المطلوب. مثلاً:

Create a portfolio website for an Icelandic landscape photographer.
Include a home page, reusable photo collections, an about page,
and structured page sections that editors can reorder.

الوكيل يقدر يطرح أسئلة توضيحية مركّزة إلا خلا الوصف اختيارات مهمة بلا حسم. جاوب على هاد الأسئلة قبل ما تتوقّع مخطط وواجهة متناسقين.

2. خلّي الوكيل ينمذج ويبني الموقع

من بعد التوضيح، الوكيل كيحدّد شنو خاصو يكون فالمجموعات القابلة لإعادة الاستعمال، وشنو من الصفحات السردية خاصها تستعمل كتل منظّمة. من بعد كينشئ مخطط EmDash، كيحدّث الأنواع المولّدة، كيكتب مرسِمات Astro، وكيضيف محتوى تمثيلي باستعمال أدوات MCP.

3. راجع المعاينة الخاصة

استعمل المعاينة المباشرة ديال Builder باش تفتّش المسارات المولّدة والتصميم العام. EmDash Build كيتحقّق من المشروع المولّد ويقدر يصلّح الأعطال اللي يكتاشفها داخل دورة الوكيل.

4. كمّل التعديل فـ EmDash

ملي يولي المشروع الأولي قابل للاستعمال، دبّر المحتوى العادي من خلال واجهة إدارة EmDash. تقدر تعدّل النصوص والوسائط، تزيد الأقسام أو تنسخها، ترتّب الكتل، وتبرمج المنشورات. رجع للوكيل ملي تحتاج تغييرات أوسع فالبنية أو المحتوى أو التصميم.

5. حفظ ورجّع حالة المشروع

حالات المشروع المتناسقة كتتسجّل فـ Cloudflare Artifacts على شكل تاريخ Git. هاد الاستمرارية كتخلّي EmDash Build يرجّع مصدر المشروع وحالة CMS المحلية ملي ينعس Sandbox وكيولي خاص حاوية جديدة.

أوامر التحقّق والتطوير

استعمل أوامر المستودع المناسبة لنوع التغيير اللي كتدير:

  • pnpm dev كيبدا EmDash Build بالإعداد الافتراضي.
  • pnpm dev:ui كيبدا الواجهة بلا حاويات Cloudflare Sandbox.
  • pnpm check كيدير التحقّق من الأنواع ديال التطبيق واختبارات Worker.
  • pnpm test كيشغّل مجموعة اختبارات التطبيق.
  • pnpm test:worker كيشغّل مجموعة اختبارات التكامل ديال Workers.
  • pnpm build كيبني EmDash Build بالإعداد الافتراضي.
  • pnpm build:provider كيبني باستعمال wrangler.provider.jsonc.
  • pnpm format كينسّق المستودع باستعمال oxfmt.

قبل ما تقدّم مساهمة، شغّل سلسلة التحقّق الكاملة اللي كيوصي بها المشروع:

pnpm format
pnpm check
pnpm test
pnpm test:worker
pnpm build

نصائح متقدمة

اختار وضع التطوير الصحيح

استعمل pnpm dev:ui للخدمة المعزولة على الواجهة، حيث ما كيبداش حاويات Sandbox. ما تستعملوش باش تتحقّق من مسارات التوليد: التوليد المعتمد على Sandbox ما متاحش فالوضع ديال الواجهة فقط.

فرّق بين تعديل المحتوى والتغييرات البنيوية

استعمل واجهة إدارة EmDash للخدمة التحريرية العادية بحال تغيير النصوص والوسائط والأقسام والترتيب. استعمل الوكيل للتغييرات الكبيرة فالتصميم ولا فـ نموذج المحتوى. هاد الشي كيحافظ على التقسيم ديال المشروع بين بيانات CMS المنظّمة وكود العرض المعرّف بالأنواع ديال Astro.

فحص إعداد المزوّد

اعتبر إعداد المزوّد النموذجي غير قالب. بدّل كل قيمة نموذجية، شغّل pnpm preflight، ولّد إعداد Wrangler باستعمال pnpm configure، وفتّش الناتج للحساب المستهدف فـ Cloudflare.

خلّي النشر تحت تحكّم واضح

النشر العمومي كيتدار من جهة السيرفر وموقوف افتراضياً. فعّلو وضبطو غير ملي يكون المزوّد اللي خدام واجد يجهّز إصدارات ثابتة متحقَّق منها لـ Workers for Platforms. حتى العرض المستضاف مخلي النشر موقوف.

راجع حدود الأمان قبل النشر

راجع نموذج التهديدات ديال المستودع باش تعرف التفاصيل على أدوات النماذج، تنفيذ Sandbox، الأسرار، المعاينات الخاصة، الاستمرارية، والنشر. واستعمل دليل العمليات للفحوصات التشغيلية.

تنقّل فالمستودع بكفاءة

  • src/worker فيه مسارات Worker، وBuilderAgent، والمطالبات، والأدوات، والاستمرارية، وضوابط النشر.
  • src/client فيه واجهة Builder ديال React، والمحادثة، وواجهات النشاط، والمعاينة المباشرة.
  • prototype/builder-cloudflare فيه الهيكل الفارغ المجهّز ديال EmDash وAstro المستعمل للمشاريع الجديدة.
  • migrations فيه ترحيلات قاعدة البيانات الخاصة بالمصادقة والتحكّم فالمزوّد.
  • scripts فيه إعداد المزوّد، واختبارات الدخان، والمساعدات التشغيلية.
  • test فيه تغطية التطبيق وWorker.
  • docs فيه وثائق الاستضافة الذاتية، والأمان، والعمليات، والتنفيذ.

الخلاصة

EmDash Build كيجمع بين التوليد بمساعدة الذكاء الاصطناعي وسير عمل متين وقابل للتعديل فـCMS. كينشئ محتوى EmDash منظّم ومكوّنات Astro مْحدّدة الأنواع، وكيفحص النتيجة فمعاينة خاصة داخل Cloudflare Sandbox، وكيخزّن تاريخ المشروع فـCloudflare Artifacts. وحيت هو تطبيق مرجعي ألفا وكيحتاج لبنية تحتية مهمّة، خاصك تهيّأ موارد المزوّد بعناية، وتراجع وثائق الأمان، وتخلي النشر العمومي متحكَّم فيه بشكل صريح.