شغّل لوحة التحكم محليًا
شغّل حزمتك على جهازك باستخدام Docker، ثم سجّل الدخول.
لحزمة واجهة + خلفية
قبل أن تبدأ: ثبّت Docker Desktop وافتحه، أو Docker Engine على Linux. لا تحتاج إلى أي شيء آخر.
اطّلع على المتطلباتنزّل قالبك
افتح صفحة «قوالبي» ونزّل ملف ZIP الخاص بالحزمة الكاملة.
النتيجة المتوقعة: يوجد في التنزيلات ملف باسم يشبه
dashboard-2-full-stack-….zip.فك الضغط وافتح المجلد
فك ضغط الملف وافتح طرفية في المجلد
dashboard-2-full-stack. على Windows، فك الضغط في مستكشف الملفات، ثم افتح طرفية في المجلد.الطرفيةunzip dashboard-2-full-stack-*.zip cd dashboard-2-full-stackالنتيجة المتوقعة: يحتوي المجلد على
تواجه مشكلة؟back-endوfront-endوdocker-compose.ymlوREADME.mdوQUICKSTART.md.شغّل التطبيقات
ابنِ واجهة API ولوحة التحكم وشغّلهما. لا حاجة إلى ضبط أي شيء أولًا. يبني التشغيل الأول صورتين ويملأ قاعدة البيانات بالبيانات النموذجية، وهذا يستغرق بضع دقائق؛ أما التشغيلات اللاحقة فتستغرق ثوانيَ.
الطرفيةفيdashboard-2-full-stackdocker compose up --buildالمنفذ مستخدم بالفعل؟
إذا توقف التشغيل برسالة
المنفذ مستخدم بالفعلports are not available ... address already in useأوport is already allocated، فهناك برنامج آخر يستخدم 3030 أو 8000. أوقفه، أو أنشئ ملفًا باسم.envفي المجلدdashboard-2-full-stackبجوارdocker-compose.yml، وضع فيه المنفذ الذي تريده، مثلDASHBOARD_PORT=3040(وAPI_PORTلواجهة API). شغّلdocker compose up --buildمرة أخرى وافتح لوحة التحكم على منفذها الجديد.النتيجة المتوقعة: تبقى الخدمتان قيد التشغيل ويتوقف السجل عن التمرير. اترك هذه الطرفية مفتوحة.
تواجه مشكلة؟افتح لوحة التحكم وسجّل الدخول
افتح localhost:3030محلي. ستنقلك إلى صفحة تسجيل الدخول. سجّل الدخول بالبريد
admin@example.comوكلمة المرورAdmin@123. الواجهة العربية على المسار/ar.النتيجة المتوقعة: تفتح النظرة العامة بالأرقام والمخططات والتقويم ومهامك السريعة.
تواجه مشكلة؟
تجيب واجهة API على localhost:8000/
حسابات تسجيل الدخول
| الحساب | البريد الإلكتروني | كلمة المرور |
|---|---|---|
| Super Admin: كل صفحة وكل إجراء | admin@example.com | Admin@123 |
| Viewer: يرى كل القوائم، ولا يستطيع إنشاء السجلات أو تعديلها أو حذفها، ولا فتح المساعد الذكي؛ ويستطيع تغيير كلمة مروره ومهامه السريعة | john.smith@admin.com | admin123 |
يضيف الـ seed عشرة مشرفين آخرين بدور Viewer، وكلمة مرور جميعهم admin123.
قبل الإطلاق. كل seed (yarn seed وyarn seed:prod والتشغيل الأول في Docker) ينشئ هؤلاء المشرفين النموذجيين بكلمات المرور هذه. غيّر كلمات مرورهم أو احذفهم، واضبط JWT_SECRET الخاص بك، قبل أن يصبح بإمكان أي شخص آخر الوصول إلى لوحة التحكم.
جولة سريعة
شكل لوحة التحكم بعد تشغيلها.
أوقف التطبيقات وأعد تشغيلها
اضغط Ctrl+C في الطرفية لإيقاف التطبيقات، أو نفّذ هذا من المجلد. تُحفظ بياناتك في وحدة التخزين dashboard-2-data.
dashboard-2-full-stackdocker compose downأعد التشغيل بالأمر نفسه في الخطوة 3. من دون --build يعيد استخدام الصور التي بنيتها مسبقًا.
dashboard-2-full-stackdocker compose upحافظ على بياناتك
docker compose down -v يحذف وحدة تخزين البيانات أيضًا. يملأ التشغيل التالي نسخة جديدة من البيانات النموذجية، وكل ما أنشأته يضيع.
شغّل لوحة التحكم
هذه الحزمة هي لوحة التحكم وحدها. عند بناء الصورة من دون وسائط، تعمل على واجهة API التجريبية المدمجة، فلا تحتاج إلى back-end لتجربتها.
نزّل قالبك
افتح صفحة «قوالبي» ونزّل ملف ZIP الخاص بلوحة الإدارة.
النتيجة المتوقعة: يوجد في التنزيلات ملف باسم يشبه
dashboard-2-front-end-….zip.فك الضغط وافتح المجلد
الطرفيةunzip dashboard-2-front-end-*.zip cd dashboard-2-front-endالنتيجة المتوقعة: يحتوي المجلد على
تواجه مشكلة؟Dockerfileوpackage.jsonوmessagesوpublicوsrc.ابنِ الصورة
يثبّت Docker الاعتماديات ويبني لوحة التحكم داخل الصورة. يستغرق البناء الأول بضع دقائق ويحتاج إلى اتصال بالإنترنت.
الطرفيةفيdashboard-2-front-enddocker build -t dashboard-2 .النتيجة المتوقعة: ينتهي البناء بسطر يذكر اسم الصورة
تواجه مشكلة؟dashboard-2.شغّلها وسجّل الدخول
شغّل حاوية، ثم افتح localhost:3030محلي وسجّل الدخول بالبريد
admin@example.comوكلمة المرورAdmin@123. اترك الطرفية مفتوحة أثناء استخدامك. إذا كان المنفذ3030مشغولًا، فغيّر الرقم الذي على يسار-p، مثل-p 3040:3030، وافتح localhost:3040محلي بدلًا منه.الطرفيةفيdashboard-2-front-enddocker run -p 3030:3030 dashboard-2النتيجة المتوقعة: تفتح النظرة العامة، مع إشعار «بيانات تجريبية» أسفل الصفحة.
تواجه مشكلة؟
حسابات تسجيل الدخول
| الحساب | البريد الإلكتروني | كلمة المرور |
|---|---|---|
| Super Admin: كل صفحة وكل إجراء | admin@example.com | Admin@123 |
| Viewer: يرى كل القوائم، ولا يستطيع إنشاء السجلات أو تعديلها أو حذفها، ولا فتح المساعد الذكي؛ ويستطيع تغيير كلمة مروره ومهامه السريعة | john.smith@admin.com | admin123 |
على واجهة API التجريبية تبقى هذه الحسابات والبيانات النموذجية في متصفحك: ما تنشئه أو تعدّله أو تحذفه يُحفظ في ذلك المتصفح فقط، ومسح بيانات الموقع يعيد البيانات النموذجية.
أوقف التطبيقات وأعد تشغيلها
اضغط Ctrl+C في الطرفية لإيقاف لوحة التحكم. إذا أغلقت تلك الطرفية، فابحث عن الحاوية وأوقفها:
docker ps
docker stop <container-id>استخدم المعرّف الذي يعرضه docker ps للصورة dashboard-2. لتشغيلها مرة أخرى، نفّذ أمر docker run نفسه. بعد تغيير أي ملف، ابنِ الصورة من جديد: فهي تحتفظ بنسخة من الكود وقت بنائها.
وجّهها إلى واجهة API الخاصة بك
يُضمَّن عنوان واجهة API في كود JavaScript الذي يحمّله المتصفح، لذلك يُمرَّر وسيط بناء. استخدم العنوان الذي يصل به المتصفح إلى واجهة API، مع /api، والعنوان نفسه من دونها للتحديث الفوري للصلاحيات:
dashboard-2-front-enddocker build -t dashboard-2 --build-arg NEXT_PUBLIC_API_BASE_URL=http://localhost:8000/api --build-arg NEXT_PUBLIC_WEBSOCKET_BASE_URL=http://localhost:8000 .
docker run -p 3030:3030 dashboard-2يجب أن تسمح واجهة API بعنوان لوحة التحكم، http://localhost:3030، في CORS_ORIGIN الخاص بها. كُتبت لوحة التحكم لواجهة NestJS API الخاصة بهذا القالب، وهي تأتي مع الحزمة الكاملة.