برنامج Angular 8 التعليمي: خطوة بخطوة

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

تناقش هذه المقالة وظائف وميزات Angular و Angular 8 لمعرفة إطارها من البداية.

تحقق من دوراتنا المجانية المتعلقة بتطوير البرمجيات.

استكشف دوراتنا المجانية لتطوير البرمجيات

ما هو الزاوي؟

Angular هو إطار عمل مفتوح المصدر من جانب العميل ، قائم على نصوص جافا ، لتطوير التطبيقات المستندة إلى الويب ، ويفضل استخدامه لإنشاء تطبيقات ديناميكية للصفحة الواحدة أو SPA. للتلخيص ، Angular هو:

• إطار عمل منظم قائم على MVC
• إطار عمل لتطوير تطبيقات الصفحة الواحدة (SPA)
• يدعم ميزات القوالب من جانب العميل
• يوفر اختبار الكود قبل النشر

ما هو Angular 8؟

Angular 8 عبارة عن بنية قائمة على TypeScript من جانب العميل تم تأطيرها لإنتاج تطبيقات ويب ديناميكية. كان الإصدار الأول من Angular في عام 2012 يسمى AngularJS. Angular 8 هو أحدث إصدار مزود بمكتبة واجهة مستخدم ممتازة (UI).

يعد مكون واجهة المستخدم (UI) في Angular 8 عالي الكفاءة في إنشاء صفحات ويب وتطبيقات ويب وظيفية وجذابة ومتسقة. يأتي هذا الإطار بهيكل شجرة يحتوي على مكونات رئيسية وتابعة.

يساعد إطار Angular 8 في إنشاء مواقع ويب سريعة الاستجابة ، مما يسمح لصفحات الويب بتلائم أي حجم شاشة ، مع توافق شامل للأجهزة ، بما في ذلك الهواتف المحمولة والأجهزة اللوحية والأنظمة الكبيرة وأجهزة الكمبيوتر المحمولة.

تعلم دورات تطوير البرمجيات عبر الإنترنت من أفضل الجامعات في العالم. اربح برامج PG التنفيذية أو برامج الشهادات المتقدمة أو برامج الماجستير لتتبع حياتك المهنية بشكل سريع.

استكشف دوراتنا التدريبية الشهيرة في هندسة البرمجيات

ماذا تفهم من خلال تطبيقات الصفحة الواحدة (واس)

تطبيق الصفحة الواحدة (SPA) هو تطبيق ويب أو موقع ويب يعيد كتابة الصفحة الحالية بمحتوى محدث دون تحميل صفحات جديدة من الخادم.

يرسل تطبيق الصفحة الواحدة (SPA) البيانات لتفاعل المستخدم ، ويعرضها المتصفح لتقديم النتائج. يختلف سلوك العرض تمامًا عن الطريقة التقليدية التي تطلب إعادة تصيير صفحة كاملة ، ولكن SPA يعرضها عند الطلب بنقرة واحدة. باتباع نهج SPA ، يمكنك تحسين أداء أي تطبيق ويب.

كيفية الترقية إلى Angular 8؟

إذا كنت ترغب في تحديث Angular Framework القديم الخاص بك إلى Angular 8 ، فقم بتشغيل الأمر المحدد لتحديث سهل.

تحديث Ng @ angular / cli @ angular / Core

مهارات تطوير البرمجيات عند الطلب

ما الذي يميز Angular 8؟

يحتوي Angular 8 على إصدارات حديثة ومحدثة من الميزات السابقة. بعض هؤلاء هم:

• دعم محرك Ivy Renderer - المترجم الجديد لـ Angular 8
• الطباعية 3.4 أو دعم أعلى
• مفهوم تحميل الوحدة الديناميكية
• أداة بناء جديدة Bazel
• التحميل التفاضلي لتحسين الأداء
• يدعم قالب SVG
• يدعم Web Worker
• تحسين ngUpgra

ما هي متطلبات التثبيت الأساسية لـ Angular 8؟

قم بتثبيت المتطلبات الأساسية المذكورة لبيئة Angular 8:

• نسخة مطبوعة 3.4 أو أعلى
• أحدث Node JS، LTA 10.16 أو أعلى
• أي IDE مثل Microsoft Visual Studio 2015 أو أعلى أو Visual Studio Code
• Angular CLI لتشغيل مشروع Angular

هندسة الزاوي 8

يدمج Angular 8 الوظائف الأساسية كمكتبات TypeScript لتقديمها في التطبيق. يتكون تطبيق Angular 8 من لبنات بناء أساسية تُعرف باسم NgModules ، مما يوفر سياق تجميع للمكونات. بالإضافة إلى ذلك ، هناك وحدة جذرية في Angular 8 ، والتي تتيح التمهيد.

بعض الأجزاء الأساسية من الهندسة المعمارية Angular 8 هي كما يلي:

اقرأ مقالاتنا الشهيرة المتعلقة بتطوير البرمجيات

1. القوالب

يتضمن القالب Angular HTML مع علامة Angular ، والتي تعدل عناصر HTML قبل عرضها. يوفر منطق البرنامج ويربط الترميز الذي يربط بين DOM وبيانات التطبيق.

مثال:

<div style = "text-align: center">

<h1>

{{2 | قوة: 5}}

</h1>

</div>

استخدم ملف HTML هذا نموذجًا وأنبوبًا بداخله لتحويل القيم إلى الإخراج المطلوب.

2. وحدات

تختلف Angular 8 NgModules عن وحدات JavaScript النمطية الأخرى. يمكن أن يوفر كل تطبيق Angular 8 آلية تمهيد لبدء تشغيل التطبيق. بعض ميزات وحدات Angular 8 هي:

• تتيح NgModules إمكانية استيراد الوظائف واستخدامها بواسطة وحدات نمطية أخرى. على سبيل المثال ، إذا كنت تريد استخدام خدمة المسار في التطبيق ، فيمكنك استيراد وحدة Route Ng.
• تستورد NgModules وظائف من NgModules أخرى. مثال - وحدات جافا سكريبت

3. المكونات

المكونات هي اللبنات الأساسية لإطار Angular 8. يحدد كل مكون فئة تحتوي على منطق وبيانات وتطبيق لربطها بقالب HTML.

4. ربط البيانات

Angular يقوم بالاتصال بين DOM ومكون. يبسط إطار عمل التطبيق التفاعلي دون دفع البيانات وسحبها. هناك نوعان من ربط البيانات:

• ربط الحدث - يستجيب التطبيق لإدخال المستخدم في البيئة المستهدفة عن طريق تحديث بيانات التطبيق.
• ربط الخاصية - يقحم القيم المحسوبة من بيانات التطبيق إلى HTML.

5. البيانات الفوقية

في Angular ، يعمل المصممون كبيانات وصفية. وتتمثل مهمتها الأساسية في تحسين الفصل لتكوين السلوك المتوقع للفصل. على سبيل المثال ، يمكن للمستخدمين استخدام البيانات الوصفية في فئة ، لذلك يعرف تطبيق Angular أن مكون التطبيق هو مكون. بالإضافة إلى ذلك ، يمكن إرفاق البيانات الوصفية بـ TypeScript باستخدام المصمم.

6. الخدمات

الغرض من استخدام الخدمات هو إعادة استخدام الرمز. يتم إنشاء الخدمات القياسية للرموز المطبقة على أكثر من مكون. يوفر المصمم البيانات الوصفية ، والتي تسمح بحقن الخدمات في مكون العميل كعنصر تبعية. يميز Angular الخدمة والعنصر لزيادة نمطية وإعادة الاستخدام.

7. التوجيهات

تهدف التوجيهات إلى توسيع وظائف عمل عناصر HTML. هناك ثلاثة أنواع من التوجيهات المتاحة في Angular - توجيهات السمات والتوجيهات الهيكلية وتوجيهات المكونات.

إلى جانب التوجيه المدمج ، يمكنك إنشاء التوجيه الخاص بك عن طريق تطوير فئة JavaScript وتطبيق السمةDirective عليها. بعد ذلك ، ضع السلوك في الفصل وفقًا لمتطلبات عملك.

8. حقن التبعية (DI)

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

استنتاج

Angular 8 هو حل يمكن الوصول إليه بشكل كبير مع تركيزه الوحيد على الاتجاهات التكنولوجية. مع التحديثات المتكررة ، يستمر Angular Framework في أن يصبح فعالًا ومنصة مفضلة لمطوري الويب.

انضم إلى برنامج upGrad Executive PG في تطوير Full Stack

يمكن لمتخصصي تكنولوجيا المعلومات أو المبتدئين الذين يتطلعون إلى تحسين مجموعة مهاراتهم التسجيل في برنامج upGrad التنفيذي للدراسات العليا في تطوير Full Stack . تزود الدورة المتعلمين ليصبحوا مطورين فعالين ومتكدرين وكسب فرص جذابة في صناعة تكنولوجيا المعلومات.

يقدم خبراء الصناعة وأعضاء هيئة التدريس من الطراز العالمي الدورة التدريبية بشهادة تنفيذية في علوم البيانات والتعلم الآلي مجانًا. يقدم البرنامج أيضًا الدعم الوظيفي الكامل من خلال المقابلات الوهمية ، ومعارض العمل ، وما إلى ذلك.

قم بزيارة upGrad لمعرفة المزيد عن البرنامج وحجز مكانك لتصبح خبيرًا!