0Pricing
Angular Academy · درس

البناء والتقديم

شغّلوا خادم التطوير وأنشئوا نسخ البناء

البناء والتقديم درس مجاني في Angular Academy على CoddyKit. هذا هو الدرس 4 من أصل 4. يمكنك قراءة الدرس كاملاً أدناه مجاناً — ثم تمرن عليه مباشرة في المتصفح باستخدام محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7. هذا الدرس جزء من مسار التعلم في Angular Academy، وتقدمك يتزامن عبر الويب وتطبيق CoddyKit. تتضمن دورة Angular Academy 4 دروس في المجموع.

البناء والتشغيل

يشغّل CLI تطبيقكم محليًا أثناء التطوير وينتج مخرجات محسّنة للإنتاج. والأمران الأساسيان هما ng serve وng build.

ng serve

يبدأ ng serve خادم تطوير محليًا مع إعادة تحميل مباشرة. عدّلوا ملفًا وستُحدّث الصفحة في المتصفح تلقائيًا.

ng serve

العنوان الافتراضي

يعمل خادم التطوير افتراضيًا على العنوان http://localhost:4200. افتحوا عنوان URL هذا لرؤية تطبيقكم.

تغيير المنفذ والمضيف

يمكنكم تغيير المنفذ أو المضيف باستخدام الخيارات.

ng serve --port 4300 --host 0.0.0.0

فتح المتصفح

يفتح خيار open المتصفح الافتراضي لديكم تلقائيًا.

ng serve --open
# or: ng serve -o

ng build

يُجمّع ng build التطبيق في ملفات ثابتة جاهزة للنشر، وتُكتب هذه الملفات في مجلد dist.

ng build

تحسينات الإنتاج

تطبّق عمليات بناء الإنتاج تحسينات تشمل التجميع مسبقًا، والتصغير، وtree-shaking، وتجميع الحزم، لإنتاج مخرجات أصغر وأسرع.

ناتج dist

يوضع ناتج البناء في dist/<project-name>/. انشروا هذه الملفات الثابتة على أي مضيف ويب أو CDN.

إعدادات البناء

يعرّف angular.json إعدادات مثل production وdevelopment. اختاروا أحدها باستخدام خيار configuration.

ng build --configuration production

المراقبة أثناء البناء

لإعادة البناء المستمرة من دون تشغيل خادم، يعيد خيار watch البناء عند تغيّر الملفات.

ng build --watch

تشغيل الاختبارات

تشمل الأوامر ذات الصلة ng test لاختبارات الوحدات وng lint للتحليل الساكن، عند إعداده.

ng test

تحقق سريع: التشغيل مقابل البناء

التطوير المحلي مقابل النشر.

مراجعة: البناء والتشغيل

استخدموا ng serve للتطوير المحلي مع إعادة التحميل المباشرة على localhost:4200، واستخدموا ng build لإنتاج ملفات ثابتة محسّنة في dist/ للنشر. وتتيح الإعدادات والخيارات ضبط المضيف والمنفذ ومستوى التحسين. لقد أكملتم دورة CLI.

الأسئلة الشائعة

هل درس «البناء والتقديم» مجاني؟

نعم — نص درس «البناء والتقديم» كامل متاح مجاناً هنا على الويب. لتمرينه بشكل تفاعلي (محرر أكواد مدمج ومدرس ذكاء اصطناعي متاح 24/7) وفتح باقي دورة Angular Academy، انتقل إلى CoddyKit PRO. تتضمن دورة Angular Academy 4 دروس في المجموع.

ماذا ستتعلم في «البناء والتقديم»؟

شغّلوا خادم التطوير وأنشئوا نسخ البناء تتمرن على Angular Academy مع أكواد عملية تشغلها مباشرة في المتصفح، ومدرس ذكاء اصطناعي متاح 24/7 يجيب على أسئلتك أثناء عملك.

هل أحتاج إلى خبرة سابقة لأبدأ Angular Academy؟

لا تُشترط خبرة سابقة. Angular Academy على CoddyKit منظم للمبتدئين حتى المتقدمين، لذا يمكنك البدء من هنا أو من البداية والتقدم بسرعتك الخاصة. هذا هو الدرس 4 من أصل 4.

كم من الوقت يستغرق درس «البناء والتقديم»؟

معظم دروس CoddyKit تستغرق حوالي 5–10 دقائق. كل منها موجز وتفاعلي، لذا تحرز تقدماً مستمراً وتستأنف من حيث توقفت عبر الويب والتطبيق.

هل يمكنني كتابة وتشغيل أكواد في درس Angular Academy هذا؟

نعم. كل درس في Angular Academy يتضمن محرر أكواد مدمج، لذا تكتب وتشغل أكواداً حقيقية مباشرة في متصفحك وتحصل على تعليقات فورية من الذكاء الاصطناعي — بدون إعداد محلي.

جميع الدروس في هذه الدورة

  1. إنشاء مشروع جديد
  2. شرح بنية المشروع
  3. إنشاء الشيفرة باستخدام ng generate
  4. البناء والتقديم
← العودة إلى Angular Academy