الصفحة الرئيسية>موارد بناء الموقع>بيانات الموقع
تنزيل

الواجهة الجبهة زعيفان

تطبيق ويب Aurelia الذي يستهلك API Cheftan لأتمتة المهام

ابدء

لإعداد بيئة تطوير ، ستحتاج إلى تثبيت Node.js على جهازك المحلي. يمكنك تنزيله من هنا.

بمجرد الانتهاء من ذلك ، استنساخ مستودع CHIEFTAN وتركيب npm install لتثبيت مختلف التبعيات المطلوبة من قبل CHIEFTAN.

تطوير

تم تصميم بيئة التطوير حول حزمة الويب مع تمكين إعادة تحميل الوحدة الساخنة ، مما يسمح (بالقرب) بالتحديثات الحقيقية لكل من أوراق الأنماط والرمز (إذا لم يتم تشغيله بعد) بدون إعادة تحميل الصفحة. يمكنك بدء تشغيل خادم التطوير عن طريق تشغيل npm run server:dev من مجلد المشروع ثم الوصول إلى http://localhost:3002 في متصفحك.

النشر

يتضمن النشر إنشاء حزمة إنتاج للتطبيق ثم وضع محتويات مجلد dist على الخادم الخاص بك. لإنشاء حزمة الإنتاج ، ما عليك سوى تشغيل npm build وانتظر إكمال WebPack.

إذا كنت ترغب في تمكين تقارير خطأ Sentry لأخطاء الواجهة الأمامية ، فيجب عليك تعيين متغير البيئة SENTRY_DSN على الحارس العام DSN. يمكنك أيضًا وضع علامة على إصدار الإصدار عن طريق تعيين متغير بيئة VERSION .

مثال بناء البرنامج النصي 

SENTRY_DSN= " https://[email protected]/1 " VERSION= " $( git rev-parse HEAD ) " npm run build

سيقوم برنامج Build Script بتمييز الإصدار باستخدام GIT SHA الحالي وتكوين تقارير خطأ Sentry.

عناوين URL لطيفة

تجدر الإشارة إلى أنه إذا كنت ترغب في الاستفادة من واجهة برمجة تطبيقات HTML5 Push State لعناوين URL لطيفة ، فستحتاج إلى تكوين خادم الويب الخاص بك لخدمة ملف index.html لجميع 404s.

مع Nginx يمكن بسهولة تحقيق ذلك باستخدام توجيه try_files .

مثال تكوين nginx 

 server {
  listen :80 default;
  hostname chieftan.emss.co.za;

  root /var/www/chieftan/dist;

  # Serve the frontend
  location / {
    try_files $url $url.html index.html;
  }

  # Pass API requests to the application instance (basic)
  location /api {
    proxy_pass http://127.0.0.1:8000;
  }
}

صور Docker

يمكنك أيضًا نشر واجهة Cheftan باستخدام Docker ، لبناء الصورة ببساطة تشغيل npm build && docker build . لإنشاء صورة حاوية مع أحدث حزمة التطبيق المترجمة.

تعتمد هذه الحاوية على nginx:alpine ، مما يجعلها خفيفة الوزن للغاية ، وسوف تستمع إلى المنفذ 3000 افتراضيًا. يمكنك اتباع التعليمات الموجودة على صفحة صورة Nginx Docker لتكوينها بشكل مختلف ، أو وضعها خلف وكيل عكسي في عمليات نشر الإنتاج.

يوسع
معلومات إضافية
تطبيقات ذات صلة
نوصي لك
أخبار ذات صلة الكل