كيف تبني منصة LMS مع حصص مباشرة باستخدام Next.js
ابنِ منصة دورات تعليمية فيها حصص مباشرة واختبارات وشهادات ودفع عبر Stripe باستخدام Next.js وNestJS. مثال عملي خطوة بخطوة.

في نهاية هذا الدليل ستعرف كيف تبني منصة دورات تعليمية عبر الإنترنت فيها دروس مسجلة وحصص مباشرة واختبارات وشهادات ودفع مدمج، باستخدام Next.js وNestJS وقالب Learnio LMS من Aniq UI. لن تحتاج إلى بناء موقع للطلاب ولوحة إدارة وواجهة API كلًا على حدة.
نتابع مثال مدرسة واحدة من خطتها الأولى حتى الإطلاق. كل خطوة تذكر الشاشة أو الإعداد المعني، والأوامر مأخوذة مباشرة من توثيق القالب. المسار نفسه يناسب صانع دورات يعمل وحده، أو شركة تدريب، أو وكالة تبني منصة تعليمية لعميل.
المتطلبات
Ledgerline Academy مدرسة صغيرة عبر الإنترنت تعلّم المحاسبة لأشخاص يغيّرون مسارهم المهني. يدرّس فيها مدرّسان. تريد المدرسة أن تبدأ بعدد قليل من الدورات ثم تكبر. هذا ما تحتاجه:
- دورة تمهيدية مجانية يستطيع أي شخص أخذها، ليجرّب الزوار المدرسة قبل أن يدفعوا.
- دورات مدفوعة فيها دروس مسجلة وملاحظات شخصية وأوراق عمل قابلة للتنزيل.
- حصة مباشرة كل أسبوع لكل دفعة، تُعقد داخل المنصة بدل رابط اجتماع منفصل.
- اختبارات لها درجة نجاح، وواجبات يصححها المدرّس مع ملاحظات.
- شهادة في نهاية الدورة، مع صفحة يستطيع صاحب العمل التحقق منها عبرها.
- مدرّسان يدير كل منهما دوراته وطلابه فقط.
- نسخة إنجليزية ونسخة عربية من المدرسة كلها.
كيف يغطي القالب هذه المتطلبات
| الحاجة | أين توجد | ما الذي تستخدمه |
|---|---|---|
| دورات مجانية ومدفوعة | موقع الطلاب وواجهة API | صفحات الدورات والدفع؛ السعر 0 يتخطى الدفع تمامًا |
| محتوى الدورة | لوحة الإدارة | منشئ المنهج بأقسامه ودروسه وحالتي المسودة والمنشور |
| الملاحظات وأوراق العمل | موقع الطلاب | مشغّل الدورة، مع ملاحظات وموارد قابلة للتنزيل في كل درس |
| حصة مباشرة أسبوعية | لوحة الإدارة وموقع الطلاب وخادم الاجتماعات الخاص بك | الحصص المباشرة وتقويم الدورة وخادم Jitsi Meet تشغّله بنفسك |
| الاختبارات والواجبات | لوحة الإدارة وموقع الطلاب | محرر الاختبارات وتصحيح الواجبات، والدرجة تُحسب على الخادم |
| الشهادات | موقع الطلاب | صفحة الشهادات وصفحة التحقق العامة |
| كل مدرّس يرى دوراته فقط | لوحة الإدارة وواجهة API | دور Instructor مع ملف مدرّس مرتبط بالحساب |
| استلام المدفوعات | واجهة API وموقع الطلاب | Stripe Checkout وwebhook موقّع |
| الإنجليزية والعربية | التطبيقات الثلاثة | مساران /en و/ar، وملفات الرسائل، ودورات مكتوبة باللغتين |
قبل أن تبدأ: قرارات عليك اتخاذها
في منصات الدورات بعض القرارات التي يصعب التراجع عنها بعد وجود طلاب ومدفوعات. اتخذها أولًا على الورق.
مجاني أم مدفوع أم الاثنان؟
الدورة التي سعرها 0 تسجّل الطالب فورًا ولا تصل أبدًا إلى معالج الدفع. أما الدورة المدفوعة فتمر عبر صفحة الدفع ولا يُسجَّل الطالب إلا بعد أن يؤكد المعالج الدفع. تستخدم Ledgerline النوعين: دورة تمهيدية مجانية لبناء الثقة، ووراءها الدورات المدفوعة.
مسجل أم مباشر أم الاثنان؟
يمكن تصفية الكتالوج بين الدورات المباشرة والمسجلة. الدورات المسجلة لا تحتاج إلا إلى دروس ومستودع للوسائط. أما الدورات المباشرة فتحتاج أيضًا إلى خادم اجتماعات تستضيفه أنت. قرّر هل الحصص المباشرة جزء من الإطلاق، لأن هذا الخادم بنية تحتية منفصلة لها تكلفتها.
من يدرّس، وماذا يحق له أن يلمس؟
إذا كان شخص واحد يقوم بكل شيء، يكفيك حساب مدير أعلى واحد. وإذا كان لديك عدة مدرّسين، فخطّط لملف مدرّس وحساب مرتبط به لكل واحد منهم.
أي معالجات دفع؟
يدعم القالب البطاقات عبر Stripe وPayPal. صفحة الدفع تعرض الاثنين دائمًا، لذا خطّط لإعداد الاثنين قبل استلام أموال حقيقية. وإذا كنت تريد واحدًا فقط، فخطّط لتعديل في كود صفحة الدفع.
أي لغات؟
الإنجليزية والعربية جاهزتان. محتوى الدورات يحمل لغتين فقط: قيمة بالإنجليزية وقيمة بالعربية لكل عنوان ووصف ودرس. لغة ثالثة للواجهة ممكنة، لكن لغة ثالثة للمحتوى تعني تعديلات في واجهة API وفي محررات الإدارة.
أين يُحفظ الفيديو والملفات؟
صور الدورات وفيديو الدروس والملفات المرفقة تذهب إلى مستودع Cloudflare R2 أو أي تخزين آخر متوافق مع S3. قرّر من يملك المستودع وماذا ستفعل بشأن النسخ الاحتياطية.
ماذا تقول للناس عندما يشترون؟
الإيصالات ورسائل تأكيد التسجيل تمر عبر Resend، الذي يحتاج إلى نطاق إرسال موثّق. خطّط للنطاق ولعنوان المرسل قبل أن تجرّب البريد الإلكتروني.
خطوة بخطوة
الخطوة 1: اختر الباقة
Learnio ثلاثة تطبيقات: موقع للطلاب، ولوحة إدارة للمشرفين والمدرّسين، وواجهة NestJS API خلف الاثنين. يمكنك شراؤها معًا في باقة Full Stack، أو واحدًا واحدًا. موقع الطلاب وحده يعمل ببيانات تجريبية مرفقة. ولوحة الإدارة وحدها تعمل على محاكاة داخل المتصفح، وتبقى معظم شاشاتها فارغة حتى تُربط بواجهة API.
تحتاج Ledgerline إلى أن يتفق الطلاب والمدرّسون وقاعدة البيانات فيما بينهم، لذلك تختار باقة Full Stack. وإذا كانت لديك واجهة API فعلًا، يمكن لواجهة أمامية واحدة أن تتصل بها. الرخصة التجارية تغطي عددًا غير محدود من المشاريع، بما فيها العمل الذي تسلّمه لعميل.

انظر إلى صفحة قوالبي: اختر ملف ZIP الذي يطابق الباقة التي اشتريتها.
ما الذي تتحقق منه: المجلد المستخرج للباقة الكاملة اسمه learnio-lms، ويحتوي على admin-dashboard وback-end وfrontend وdocker-compose.yml. الباقات ذات التطبيق الواحد تُستخرج في مجلد خاص بها، فيه Dockerfile وpackage.json و.env.example.
الخطوة 2: شغّل كل شيء باستخدام Docker
نزّل ملف ZIP من صفحة قوالبي، وفك ضغطه، وافتح الطرفية داخل المجلد learnio-lms. وبينما يعمل Docker، شغّل التطبيقات الثلاثة:
docker compose up --build
التشغيل الأول يبني ثلاث صور ويملأ قاعدة البيانات ببيانات تجريبية، لذلك يستغرق بضع دقائق. بعد ذلك يكون موقع الطلاب على localhost:3030 ولوحة الإدارة على localhost:3031 وواجهة API على localhost:8000. إذا كان أحد المنافذ مشغولًا، أضف SITE_PORT أو ADMIN_PORT أو API_PORT إلى ملف .env بجانب docker-compose.yml ثم شغّل الأمر مرة أخرى.
ثلاثة حسابات تجريبية تتيح لك رؤية كل جانب: طالب (demo@learnio.com، كلمة المرور Demo@123)، ومدير أعلى (admin@learnio.com، كلمة المرور Admin@123)، ومدرّس (emily-davis@learnio.com، كلمة المرور Teach@123). سجّل الدخول بكل حساب وتجوّل قبل أن تغيّر أي شيء. وبدون Docker تحتاج إلى Node.js 22 أو 24 والأمر corepack enable وطرفية لكل تطبيق، مع البدء بواجهة API.

تُظهر هذه اللقطة الطرفية مفتوحة داخل المجلد المستخرج، وهو المكان الذي تفترض كل الأوامر هنا أنك تقف فيه.

راقب مخرجات البناء: تُبنى ثلاث صور، وتنتظر الواجهتان الأماميتان حتى تعلن واجهة API أنها سليمة.

تعمل لوحة الإدارة في طرفيتها الخاصة على المنفذ 3031 بعد تشغيل واجهة API.

هذه نظرة المدير العامة التي يجب أن تراها بعد تسجيل الدخول بحساب المدير الأعلى: بطاقات ورسوم بيانية للمنصة.
ما الذي تتحقق منه: افتح localhost:8000/api/health ويجب أن يرد بحالة ok، ثم سجّل الدخول في كل تطبيق بالحسابات التجريبية. إذا ظهر في صفحة ما تنبيه عن بيانات تجريبية، فهذا يعني أن ذلك التطبيق لم يستطع الوصول إلى واجهة API.
ما الذي يخطئ عادة:
- Docker غير شغّال، أو أحد المنافذ مشغول. حرّر المنفذ 3030 أو 3031 أو 8000، أو عيّن
SITE_PORTأوADMIN_PORTأوAPI_PORT. - التشغيل الأول يبدو متوقفًا. هو في الواقع يملأ البيانات التجريبية، والواجهتان الأماميتان لا تبدآن إلا عندما تصبح واجهة API سليمة.
- يعرض Yarn الإصدار 1.22. شغّل
corepack enableثم ثبّت من جديد. - التشغيل من جديد على قاعدة بيانات تحتفظ بها لا يعيد ضبط شيء. الأمر
docker compose down -vيحذف الحجم، والتشغيل التالي يملأ بيانات تجريبية جديدة.
الخطوة 3: عيّن اسم المدرسة وشعارها وألوانها
هوية العلامة التجارية موجودة في ملفات، ولدى موقع الطلاب ولوحة الإدارة نسختان منفصلتان منها، لذلك غيّر الاثنتين:
- موقع الطلاب: الملف
src/config/site.tsيحمل الاسم والوصف وحسابات التواصل الاجتماعي. والملفsrc/config/brand.config.tsيسمّي لوحة الطالب. - لوحة الإدارة: الملف
src/config/brand.config.tsيحمل الاسم والاسم المختصر والشركة والعنوان الأساسي للبيانات الوصفية. - الشعارات: استبدل
public/assets/brand/learnio-wordmark.pngوlearnio-mark.pngبصور PNG شفافة من تصميمك بالاسمين نفسيهما. - الألوان: الملف
src/styles/theme-variables.cssفي كل تطبيق، والقيم الفاتحة تحت:rootوالقيم الداكنة تحت.dark.
تبويب App Settings في لوحة الإدارة لا يغيّر هوية التطبيقات. الحقلان site_name وsupport_email فيه يغيّران فقط الرسائل الإلكترونية التي ترسلها واجهة API. ابحث عن الاسم القديم في مجلدَي الرسائل، بالإنجليزية والعربية، وعيّن العنوان العام للموقع في NEXT_PUBLIC_SITE_URL.
ما الذي تتحقق منه: غيّر الاسم في التطبيقين، وأعد البناء، وابحث عن الاسم القديم في صفحات تسجيل الدخول وفي التذييل وفي تبويب المتصفح، بالإنجليزية وبالعربية. استبدل أيضًا أيقونة الموقع وصور المشاركة، لأن معاينات الروابط تستخدمها.
ما الذي يخطئ عادة: يتغير اسم تطبيق واحد من اثنين فقط، أو يظهر الشعار ممطوطًا لأن نسبه تختلف عن الحجم المعلن. إذا كان تصميمك بشكل آخر، حدّث العرض والارتفاع المعلنين في المكان الذي يحددهما فيه شعار الشريط الجانبي ومكوّن الشعار.
الخطوة 4: ابنِ الدورة الأولى
افتح Courses في لوحة الإدارة وأنشئ الدورة التمهيدية المجانية. أضف أقسامًا ثم دروسًا داخلها، واسحب لإعادة الترتيب. يمكن أن يكون الدرس فيديو أو قراءة أو اختبارًا أو واجبًا. أرفق أوراق العمل كموارد للدرس، واترك الدورة مسودة حتى تصبح جاهزة. لا تصل إلى الكتالوج إلا الدورات العامة المنشورة.
تُخزَّن العناوين والأوصاف والدروس مرة واحدة بقيمة إنجليزية وقيمة عربية، وتمنحك المحررات تبويبًا لكل لغة. تكتب Ledgerline اللغتين قبل النشر. الدورة المجانية سعرها 0 ولا تحتاج إلى أي معالج دفع.
ترفع الملفات (الفيديو والمرفقات وصور الدورات) إلى مستودع Cloudflare R2 أو أي مستودع آخر متوافق مع S3 بمجرد أن تعيّن المتغيرات الخمسة R2_* في back-end/.env. وإلى ذلك الحين تبقى الملفات التجريبية المرفقة مع النسخة التجريبية قابلة للتشغيل، وتفشل عمليات الرفع الجديدة فقط.
ابنِها بهذا الترتيب:
- أنشئ الدورة بعنوانها ووصفها وسعرها وفئتها، باللغتين.
- أضف الأقسام، ثم الدروس داخل كل قسم، مع اختيار نوع الدرس.
- أرفق أوراق العمل والملفات بالدروس التي تحتاجها.
- علّم الدرس كمعاينة مجانية إذا أردت أن يرى الزوار عيّنة. وحدها دروس المعاينة المجانية تعرض محتواها وفيديوها في الصفحة العامة للدورة.
- انشر الدورة عندما تصبح جاهزة. إلى ذلك الحين تبقى مسودة وترد واجهة API العامة بأنها غير موجودة.

انظر كيف تضم الأقسام دروسها، ولكل درس مقبض تسحبه لتغيير الترتيب.
ما الذي تتحقق منه: افتح الصفحة العامة للدورة في متصفح آخر. يجب أن تعرض النظرة العامة والمنهج والسعر وزر التسجيل. ثم سجّل الدخول بحساب الطالب التجريبي وافتح مشغّل الدورة لترى الدروس والملاحظات والموارد.
ما الذي يخطئ عادة: دورة تظهر في لوحة الإدارة ولا تظهر في الموقع لأنها ما زالت مسودة أو لم تُضبط كدورة عامة. وخطأ شائع آخر هو غياب العنوان العربي، فتعود الصفحة العربية بحقول فارغة.
الخطوة 5: أضف الاختبارات والواجبات والشهادات
في محرر الاختبارات، أضف الأسئلة وخيارات الإجابة، ثم عيّن درجة النجاح وحدًّا للمحاولات، أو اسمح بمحاولات غير محدودة للتدرّب. يصحّح الخادم كل محاولة، فلا يستطيع الطلاب تغيير الدرجة من المتصفح. الاختبارات الإلزامية تُحتسب ضمن إنهاء الدورة.
تظهر الواجبات في تقويم الطالب، حيث يسلّم إجابته. يفتح المدرّس التسليمات ويحفظ درجة ويكتب ملاحظات لذلك الطالب. بعد كل درس يُنهى وكل اختبار يُجتاز، تعيد واجهة API التحقق من اكتمال الدورة. وعندما تكتمل، يُعلَّم التسجيل بأنه مكتمل، وتصدر شهادة، ويصل الطالب إشعار. بعدها يستطيع أي شخص التحقق من رقم الشهادة في /en/verify-certificate دون حساب.



انظر إلى التسليم الذي ينتظر التصحيح: يضع المدرّس درجة ويكتب ملاحظات موجّهة إلى ذلك الطالب.
ما الذي تتحقق منه: خذ اختبارًا بحساب الطالب التجريبي وارسب فيه عمدًا، ثم انجح. تأكد أن حد المحاولات يوقفك عندما يجب. سلّم واجبًا من التقويم، وصححه بحساب مدرّس، وابحث عن الإشعار عند الطالب.
ما الذي يخطئ عادة: اختبار إلزامي لم يُجتز، فلا تكون الشهادة جاهزة، ويُخبَر الطالب بذلك. تحقق أيضًا من أن درجة النجاح رقم تستطيع الأسئلة بلوغه فعلًا.
الخطوة 6: استلم المدفوعات في وضع الاختبار
افتراضيًا تستخدم صفحة الدفع محاكيًا مدمجًا. لا يتصل بأي معالج دفع ولا يخصم من أحد، ورقم البطاقة الذي ينتهي بـ 0 يُرفض، مما يتيح لك تجربة دفعة فاشلة. أجرِ أولًا عملية شراء كاملة بهذه الطريقة، بحساب الطالب التجريبي.
للانتقال إلى Stripe، أنشئ مفاتيح اختبار في حسابك على Stripe وضع STRIPE_SECRET_KEY وSTRIPE_PUBLISHABLE_KEY وSTRIPE_WEBHOOK_SECRET في back-end/.env. ثم أضف في Stripe نقطة webhook تشير إلى عنوان واجهة API الخاصة بك متبوعًا بـ /api/webhooks/payments/stripe. يُسجَّل الطالب عندما يؤكد الـ webhook الدفع، لا عندما يعود إلى الموقع. وبدون الـ webhook تبقى الطلبات معلّقة.
لدى PayPal مفاتيحه الخاصة: PAYPAL_CLIENT_ID وPAYPAL_CLIENT_SECRET وPAYPAL_WEBHOOK_ID وPAYPAL_ENV. اقرأ التحذير في قسم الأخطاء أدناه قبل أن تنتقل إلى الإنتاج.


هذه صفحة الدفع كما يراها الطالب: يختار البطاقة أو PayPal، ويتبع النموذج الطريقة التي اختارها.
ما الذي تتحقق منه: اشترِ دورة مدفوعة بثلاث طرق. أولًا بالمحاكي، لتتأكد أن المقعد يظهر. ثم ارفض دفعة برقم بطاقة ينتهي بـ 0 وتأكد أنه لم يُمنح أي مقعد. ثم بعد وضع مفاتيح الاختبار في Stripe، اشترِ مرة أخرى وتأكد أن الطلب ينتقل من معلّق إلى مدفوع بعد وصول الـ webhook. تعرض صفحة الطلبات في لوحة الإدارة كل طلب مع دورته وطريقة دفعه وحالته.
ما الذي يخطئ عادة:
- الطلب يبقى معلّقًا. عنوان نقطة الـ webhook خاطئ، أو أن
STRIPE_WEBHOOK_SECRETلا يطابق تلك النقطة. - زائر غير مسجّل الدخول يضغط على الدفع فيُحوَّل إلى تسجيل الدخول. الدفع يحتاج إلى حساب طالب.
- معالج خاطئ يتولى الاختبار. الطريقة التي ليس لها مفاتيح تشغّل المحاكي.
الخطوة 7: أعدّ الحصص المباشرة
تعمل الحصص المباشرة على خادم Jitsi Meet تستضيفه أنت. القالب لا يتضمن واحدًا، وتكلفة الاستضافة عليك. وبدونه يعرض التقويم الحصص المباشرة على أنها غير متاحة. ضع بيانات الخادم في back-end/.env (ملف المثال يسرد المتغيرات)، فتصدر واجهة API الرموز التي تُدخل الطلاب والمدرّسين إلى القاعة.
يجدول المدرّس جلسة من لوحة الإدارة، فتظهر في تقويم الدورة بجانب مواعيد تسليم الواجبات. يفتحها الطلاب من /en/dashboard/calendar. تُفتح القاعة قبل موعد البدء بقليل، وتسبقها شاشة انضمام تمهيدية، ويحصل المدرّس على أدوات المضيف. تجدول Ledgerline جلسة واحدة في الأسبوع لكل دفعة.

انظر كيف تتشارك الجلسات المباشرة ومواعيد تسليم الواجبات تقويمًا واحدًا، فيرى الطالب أسبوعه كله في مكان واحد.
ما الذي تتحقق منه: جدول جلسة بحساب مدرّس، ثم افتح تقويم الطالب وتأكد أن الحصة تظهر. افتح صفحة الحصة قرب موعد بدئها وتأكد أن القاعة تصبح متاحة.
ما الذي يخطئ عادة: التقويم يعلّم الحصص على أنها غير متاحة لأنه لم يُضبط أي خادم اجتماعات، أو تُفتح القاعة مبكرًا جدًا. القاعة تُفتح قبل الحصة بقليل، وليس لحظة جدولتها.
الخطوة 8: أضف المدرّسين بالحدود الصحيحة
يسجّل الطلاب والموظفون الدخول عبر نقاط مختلفة ويحصلون على رموز لا تقبلها إلا مساراتهم الخاصة. ينشئ الـ seed ستة أدوار للموظفين: Super Admin وAdmin وManager وEditor وViewer وInstructor. دور Instructor يغطي الحصص المباشرة والواجبات والمنهج وتحرير الدورات، إضافة إلى قراءة الطلاب والتسجيلات والتقييمات.
التفصيل الأهم هو الربط بين حساب الإدارة وملف المدرّس. الحساب المرتبط يُحصر أيضًا في دوراته الخاصة: لا يرى إلا تلك الدورات وطلابها، وأي محاولة للكتابة في مكان آخر تحصل على الخطأ 403. الحساب emily-davis@learnio.com الموجود في الـ seed يوضح الإعداد. تنشئ Ledgerline المدرّسَين بهذه الطريقة، وتحتفظ بالمدير الأعلى للمالك.
ما الذي تتحقق منه: سجّل الدخول بحساب مدرّس وتأكد أن قائمة الدورات تعرض دورات ذلك المدرّس فقط. ثم حاول تعديل دورة مدرّس آخر وتأكد أن التعديل مرفوض.
ما الذي يخطئ عادة: يرى المدرّس أكثر مما ينبغي لأن حسابه غير مرتبط بملف مدرّس. أو العكس: لا يستطيع معلّم إنشاء دروس لأن الدور تنقصه صلاحية المنهج. عدّل الدور في شاشة الأدوار فيصل التغيير إلى الموظفين المسجَّل دخولهم.
الخطوة 9: اربط البريد الإلكتروني، ومساعد الذكاء الاصطناعي إن أردت
روابط التحقق وإعادة تعيين كلمات المرور والإيصالات ورسائل تأكيد التسجيل تخرج عبر Resend، بالإنجليزية والعربية. ضع RESEND_API_KEY في back-end/.env ووثّق نطاق إرسال لدى Resend. وبدون مفتاح لا ينكسر شيء: تُطبع كل رسالة في سجل واجهة API بدلًا من إرسالها، وهذا مفيد أثناء الاختبار.
تحتوي لوحة الإدارة أيضًا على مساعد ذكاء اصطناعي. يستطيع البحث عن الدورات والمدرّسين والتسجيلات، وتحويل طلب واحد إلى مسودة دورة تشمل العنوان والوصف بالعربية، وجدولة الحصص، ورسم مخططات التسجيل. يعمل بمفتاح من Google أو OpenAI أو DeepSeek تدفع أنت ثمنه. وإذا لم يوجد مفتاح في back-end/.env، فإنه يطلب من المدير مفتاحًا في المتصفح. تعامل مع ما ينشئه على أنه مسودة وراجعه قبل النشر.

تُظهر المحادثة طلبًا واحدًا تحوّل إلى مسودة دورة، يراجعها المدير ويعدّلها مثل أي دورة أخرى.
ما الذي تتحقق منه: أطلق إيصالًا بشراء دورة مدفوعة، ثم افحص صندوق بريدك. اطلب من المساعد مسودة دورة صغيرة وافتح النتيجة في محرر الدورات لتتأكد أن اللغتين مملوءتان.
ما الذي يخطئ عادة: البريد لا يصل إلى أي مكان لأن المفتاح ناقص أو النطاق غير موثّق. وحتى يوجد مفتاح، تظهر الرسائل في سجل واجهة API. كما أن المساعد لا يعمل على البيانات التجريبية غير المتصلة في لوحة الإدارة.
الخطوة 10: انتقل إلى الإنتاج
- أنشئ سرًّا بالأمر
node -e "console.log(require('crypto').randomBytes(48).toString('hex'))"واستخدمه قيمةً لـJWT_SECRET. - في
back-end/.envعيّنNODE_ENV=productionوCORS_ORIGIN(اذكر عنوانَي الواجهتين الأماميتين مفصولين بفاصلة) وFRONTEND_URL(موقع الطلاب). - في ملف
.envالخاص بكل واجهة أمامية، عيّنNEXT_PUBLIC_API_BASE_URLوفي آخره/api، وعيّنNEXT_PUBLIC_SITE_URLبالنطاق الحقيقي، وأعد البناء. هذه القيم تُدمج وقت البناء. - عيّن
NEXT_PUBLIC_WEBSOCKET_BASE_URLفي لوحة الإدارة حتى تعمل الإشعارات المباشرة. - إذا كنت تستخدم R2، فأضف المضيف العام لمستودعك باسم
NEXT_PUBLIC_MEDIA_HOSTNAME(أوMEDIA_HOSTNAMEمع Compose) وأعد البناء. - غيّر كلمات المرور التجريبية المنشورة، أو ابدأ من جداول فارغة.
مع MySQL، أنشئ قاعدة بيانات فارغة، وعيّن المشغّل والاتصال في back-end/.env، ثم شغّل yarn seed. وعلى موقع حي، ينشئ الأمر yarn db:sync الجداول دون كتابة أي صف.
ما الذي تتحقق منه بعد الإطلاق: أجرِ عملية شراء حقيقية للاختبار بمبلغ صغير أو بدورة مخفّضة، وراقب الطلب وهو يُسوّى، وتأكد من وصول رسالة تأكيد التسجيل، وتأكد أن صفحة الشهادة تُفتح لشخص غير مسجّل الدخول.
ما الذي يخطئ عادة:
- ترفض واجهة API أن تبدأ إذا كان
JWT_SECRETقيمة مثال أو كانCORS_ORIGINفارغًا، وتطبع ما يجب إصلاحه. - واجهة أمامية ما زالت تعرض تنبيه البيانات التجريبية، لأن عنوان واجهة API فيها كان مفقودًا وقت البناء.
- صفحة الدفع ترفض عملية شراء من صفحة بلغة لا تدرجها واجهة API. أضف اللغة في الجانبين قبل فتحها.
التشغيل اليومي
بعد الإطلاق، يعمل فريق Ledgerline من عدد قليل من الشاشات.
مراقبة المنصة
تعرض النظرة العامة بطاقات ورسومًا بيانية للمنصة. ويتلقى المديرون أيضًا إشعارات عندما يُمنح طالب مقعدًا، أو ينهي دورة، أو يترك تقييمًا، أو يسجّل حسابًا، أو عندما تُنشر دورة. أما المدرّس فلا يصله إلا ما يخص دوراته.
التصحيح والرد
يفتح المدرّسون التسليمات التي تنتظر التصحيح، ويحفظون درجة، ويتركون ملاحظات. ويحتفظ الطلاب والمدرّسون بمحادثة لكل دورة، فيها سجل ومرفقات صور ومؤشر للرسائل غير المقروءة.
متابعة الطلبات
لكل طلب حالة من: معلّق، أو مدفوع، أو فاشل، أو مسترد، وبوابة تسمّي المعالج أو المحاكي المدمج أو دورة مجانية. أرقام الإيرادات تستبعد الطلبات المجانية من متوسط قيمة الطلب، حتى لا تخفضه دورة تمهيدية مجانية. وإذا احتجت إلى إضافة مقعد دُفع ثمنه في مكان آخر، يستطيع المدير تسجيله يدويًا.

صفحة طلب مثل هذه تعرض الدورة وطريقة الدفع وحالة الدفع في مكان واحد.
إدارة التقييمات
تنتقل التقييمات بين منشور ومعلّق ومخفي. إذا عيّنت reviews_require_approval على true، تبقى التقييمات الجديدة معلّقة حتى ينشرها من لديه صلاحية الإشراف. كل تغيير يحدّث تقييم الدورة وتقييم المدرّس.
الأشخاص وسلال المحذوفات
حذف طالب أو مدرّس أو دورة أو فئة أو تقييم أو مقال ينقله إلى سلة محذوفات يمكن الاستعادة منها، فلا تكون الزلّة دائمة.
خطة إطلاق مثالية أسبوعًا بأسبوع
هذا الجدول مثال لـ Ledgerline، وليس وعدًا بالمدة التي سيستغرقها إطلاقك.
- الأسبوع 1، الفهم. شغّل المنظومة، وسجّل الدخول بكل دور، وأنهِ قائمة القرارات.
- الأسبوع 2، العلامة التجارية والدورة الأولى. غيّر هوية التطبيقين وابنِ الدورة التمهيدية المجانية باللغتين.
- الأسبوع 3، التقييم والمدفوعات. أضف الاختبارات والواجبات والشهادات، ثم جرّب عمليات الشراء على المحاكي وبمفاتيح اختبار Stripe.
- الأسبوع 4، الحصص المباشرة والموظفون. شغّل خادم الاجتماعات، وأنشئ حسابات المدرّسين، وأجرِ حصة تجريبية مع الزملاء.
- الأسبوع 5، الإنتاج. اضبط بيئة الإنتاج، واربط البريد الإلكتروني، وأعد بناء الواجهات الأمامية، وأجرِ عملية شراء حقيقية واحدة.
- الأسبوع 6، إطلاق تجريبي هادئ. افتح الدورة المجانية أولًا، ثم المدفوعة.
قائمة التحقق قبل الإطلاق
- استُبدلت الأسماء والشعارات والأيقونات والألوان في التطبيقين، إضافة إلى صور المشاركة.
- نُشرت الدورات باللغتين، وعُيّنت الأسعار.
- للاختبارات درجات نجاح يمكن بلوغها، وعُلّمت الاختبارات الإلزامية.
- أُعدّ Stripe وPayPal معًا، مع اشتراكات الـ webhook في مكانها.
- أُكملت عملية شراء حقيقية للاختبار ووصلت رسالة تأكيد التسجيل.
- خادم الاجتماعات يعمل وعُقدت حصة تجريبية.
- حسابات المدرّسين مرتبطة بملفات المدرّسين ومجرَّبة.
- عُيّنت
JWT_SECRETوCORS_ORIGINوFRONTEND_URLللإنتاج. - عُيّنت عناوين API في الواجهات الأمامية وعنوان الموقع ومضيف الوسائط، ثم أُعيد البناء.
- غُيّرت كلمات المرور التجريبية المنشورة أو أُزيلت.
- وُثّق نطاق Resend.
- خُطّط للنسخ الاحتياطية لقاعدة البيانات ولمستودع الوسائط.
- روجعت صفحتا الخصوصية والشروط بما يناسب نشاطك التجاري.
قالب جاهز، أو البناء من الصفر، أو منصة دورات مستضافة
منصة دورات مستضافة
تستطيع أن تضع مدرسة على الإنترنت بسرعة، والاستضافة والفيديو والمدفوعات يتولاها غيرك. الثمن رسوم مستمرة، وقيود على التصميم وسير العمل، وبيانات طلابك على نظام شخص آخر. وهي خيار جيد عندما تريد أن تدرّس ولا تحتاج إلى سلوك مخصص.
البناء من الصفر
أنت تقرر كل شيء. وأنت أيضًا تبني حسابات لفئتين من المستخدمين، ومحرر منهج، ومشغّل دروس، واختبارات، وتصحيحًا، وشهادات، وصفحة دفع مع webhooks، وبريدًا إلكترونيًا، ورموز حصص مباشرة، ولغتين، قبل أن تلقي درسك الأول.
البدء من قالب
تحصل على هذه القطع جاهزة ومترابطة، مع كود مصدري تملكه ويمكنك تغييره. أنت تستضيفه وتحدّثه وتسد الثغرات التي يذكرها هذا الدليل: خادم اجتماعات، وحسابات الدفع الخاصة بك، ونطاق بريد. وهو يناسب مدرسة تريد علامتها وقواعدها الخاصة، أو وكالة تبني المنصة لعميل.
كم تكلف إدارته
تبدأ باقات Learnio من $79 لتطبيق واحد، وباقة Full Stack التي تستخدمها Ledgerline سعرها $179. وتأتي مع رخصة تجارية ودعم مدى الحياة. والباقي هو ما تقرر تشغيله:
- استضافة للتطبيقات الثلاثة، وقاعدة بيانات إذا انتقلت من SQLite.
- تتقاضى Stripe وPayPal رسوم معالجة خاصة بكل منهما. راجع صفحة أسعار Stripe وصفحة رسوم التجار في PayPal.
- Resend للبريد الإلكتروني، إضافة إلى نطاق تستطيع توثيقه.
- خادم Jitsi Meet للحصص المباشرة، وله تكلفة استضافة خاصة به.
- مستودع متوافق مع S3 مثل Cloudflare R2 للفيديو والملفات.
- مفتاح ذكاء اصطناعي، فقط إذا استخدمت المساعد.
العمل المحلي مجاني. SQLite لا يحتاج إلى خادم قاعدة بيانات، ومحاكي الدفع لا يخصم من أحد، والدورات المجانية لا تحتاج أبدًا إلى معالج دفع.
ما الذي تخصصه بعد ذلك
- الفئات والكتالوج. عيّن حجم صفحة الكتالوج بإعداد
courses_per_page. - الإشراف على التقييمات. عيّن
reviews_require_approvalعلى true لتنتظر التقييمات الجديدة مشرفًا. - المدونة. في لوحة الإدارة محرر مدونة، وموقع الطلاب ينشر المقالات. وهي طريقة هادئة لجلب زيارات من محركات البحث.
- اللغة الافتراضية. افتح الموقع بالعربية بتعيين
defaultLocaleعلىar. - لغة ثالثة. أضف locale إلى كل تطبيق وإلى واجهة API. أما محتوى الدورات فيحمل لغتين فقط.
- الأدوار. عدّل ما يستطيع كل دور فعله في شاشة الأدوار فيصل التغيير إلى الموظفين المسجَّل دخولهم.
أخطاء شائعة
تجاهل الـ webhook
إذا دفع الطلاب ولم يحدث شيء، فالـ webhook أول ما يجب فحصه. التسجيل يتبع تأكيد المعالج، لذا فاشتراك مفقود يترك الطلبات معلّقة.
إعداد Stripe دون PayPal
تعرض صفحة الدفع دائمًا البطاقة وPayPal. والطلب المدفوع بطريقة ليس لها مفاتيح يستخدم المحاكي ويكتمل دون أن يخصم من أحد. أعدّ الاثنين قبل أن تقبل طلبات حقيقية.
انتظار حصص مباشرة دون خادم اجتماعات
يوفر القالب الجدولة والرموز وشاشات القاعة. أما خادم الاجتماعات فعليك تشغيله. وبدون خادم يعلّم التقويم الحصص على أنها غير متاحة.
صور دورات مكسورة بعد ربط مستودع
لا تعرض الواجهة الأمامية صورًا إلا من المضيفين المدرجين وقت بنائها. أضف المضيف العام لمستودعك، دون https://، وأعد البناء.
اعتبار App Settings تغييرًا للهوية
هذا التبويب يغيّر الرسائل الإلكترونية فقط. الأسماء والشعارات والألوان تأتي من ملفات في كل تطبيق.
الأسئلة الشائعة
كيف أبني LMS باستخدام Next.js؟
ابدأ من قالب يغطي أصلًا الدورات والتقدم والتقييم والدفع، ثم عدّل الهوية والمحتوى. يمنحك Learnio موقع طلاب بـ Next.js 16 ولوحة إدارة وواجهة NestJS API تعمل معًا من الآن.
هل يدعم الحصص المباشرة؟
نعم، على خادم Jitsi Meet تشغّله أنت. ينضم الطلاب والمدرّسون داخل المنصة، من تقويم دورة يعرض المواعيد النهائية أيضًا.
هل أستطيع استخدامه للعملاء؟
نعم. تغطي الرخصة عددًا غير محدود من المشاريع، بما فيها التي تسلّمها لعميل. لا يمكنك إعادة بيع الكود المصدري أو نشره كقالب.
هل يدعم العربية والاتجاه من اليمين إلى اليسار؟
نعم. التطبيقات الثلاثة تأتي بالإنجليزية والعربية، والعربية تعمل من اليمين إلى اليسار. ويُدخل محتوى الدورات باللغتين.
هل أحتاج إلى خلفية برمجية؟
لمدرسة حقيقية، نعم. تعمل الواجهات الأمامية وحدها على بيانات تجريبية، لكن الحسابات والمدفوعات والتقدم تحتاج إلى واجهة API، وهي مرفقة في باقتَي Full Stack وBackend API.
هل أستطيع بيع الدورات عبر PayPal إضافة إلى Stripe؟
يتضمن القالب كود تكامل PayPal ومسار webhook لـ PayPal بجانب مسار Stripe. ويحتاج كلاهما إلى حساباتك ومفاتيحك الخاصة.
هل أستطيع تقديم دورات مجانية؟
نعم. الدورة التي سعرها 0 تسجّل الطالب فورًا ولا تصل أبدًا إلى معالج دفع.
هل يرى المدرّسون دوراتهم فقط؟
نعم. الحساب المرتبط بملف مدرّس يُحصر في دورات ذلك المدرّس وطلابه، وتُرفض عمليات الكتابة خارجها.
ماذا يحدث عندما يفشل الدفع أو يُسترد؟
أحداث الـ webhook من المعالج تسوّي الطلب أو تفشّله أو تستردّه. ولا يُنشأ المقعد إلا عند تأكيد الدفع، فالدفعة الفاشلة لا تمنح مقعدًا أبدًا.
هل أستطيع إضافة لغة أخرى؟
نعم، للواجهة. أضف الرمز إلى قائمة اللغات في موقع الطلاب، وإلى قوائم لوحة الإدارة، وإلى قائمة اللغات المدعومة في واجهة API، ثم ترجم ملفات الرسائل. أما محتوى الدورات فلا يحمل إلا الإنجليزية والعربية.
جرّبه بنفسك
افتح النسخة التجريبية لموقع الطلاب والنسخة التجريبية للوحة الإدارة والمدرّسين. ثم اقرأ توثيق Learnio أو زر صفحة منتج Learnio. تجد خيارات أخرى في فئة قوالب التعليم وأنظمة إدارة التعلم وفي دليل أفضل قوالب Next.js.
Learnio أيضًا واحد من القوالب العشرة في حزمة قوالب Next.js.
قد يعجبك أيضًا

كيف تبني متجرًا إلكترونيًا مع لوحة إدارة باستخدام Next.js
ابنِ متجرًا إلكترونيًا بواجهة متجر ولوحة إدارة وواجهة API باستخدام Next.js وNestJS، من الإعداد المحلي حتى Stripe والإطلاق. مثال تطبيقي كامل.

كيف تبني تطبيق تدريب لياقة عبر الإنترنت باستخدام Next.js
ابنِ منصة تدريب عبر الإنترنت بقائمة عملاء وتمارين مخصصة ومتابعات أسبوعية باستخدام Next.js وNestJS. مثال تطبيقي خطوة بخطوة.

أفضل قوالب Next.js لعام 2026: مجانية ومدفوعة
أفضل قوالب Next.js لعام 2026 مرتبة حسب الاستخدام: لوحات التحكم وSaaS والمتاجر وأنظمة LMS والعقارات والمطاعم وغيرها، مع خيارات مجانية ومدفوعة.