كورس angular كامل

درس 1 • إنشاء أول مشروع Angular

يستخدم Angular CLI لإنشاء مشروع واستكشاف هيكل ملفاته وتشغيل خادم التطوير. يبني الإلمام بهيكل مساحة العمل المستخدم في الدورة.

درس 2 • إعداد بيئة التطوير

يقوم بتثبيت Node.js وnpm وAngular CLI لتجهيز مساحة عمل محلية. يمكن مباشرة من إنشاء المشروع المغطى في القسم التالي.

درس 3 • أساسيات TypeScript لـ Angular

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

درس 1 • تشريح مكون Angular

يفصل دور مزين المكون، والفئة، والقالب، والأنماط. يؤسس النموذج الذهني لكل عنصر واجهة مستخدم يتم بناؤه في هذه الدورة.

درس 2 • توجيهات السمات والأنابيب

يطبق توجيهات السمات المضمنة مثل ngClass وngStyle، ويحول البيانات باستخدام الأنابيب المضمنة. يكمل قدرات القالب قبل الانتقال إلى الخدمات.

درس 3 • توجيهات الهيكل المضمنة

يغطي ngIf وngFor وngSwitch للتقديم الشرطي والقوائم في القوالب. يمكن من عرض المحتوى الديناميكي الضروري لواجهات المستخدم الواقعية.

درس 4 • بناء جملة القالب وربط البيانات

يعلم الاستيفاء وربط الخصائص وربط الأحداث والربط ثنائي الاتجاه مع ngModel. يربط منطق المكون بـ DOM لواجهات مستخدم تفاعلية.

درس 1 • الغوص العميق في حقن التبعية

يستكشف التسلسل الهرمي لحاقن Angular ورموز المزود ونطاق الحقن. يتيح تحكماً دقيقاً في إنشاء الخدمات ومشاركتها عبر الوحدات.

درس 2 • إنشاء الخدمات واستخدامها

ينشئ خدمات باستخدام CLI، ويغلف منطق الأعمال، ويحقنها في المكونات. يوضح مبدأ المسؤولية الفردية في هندسة Angular.

درس 3 • فهم NgModules

يشرح التصريحات والاستيرادات والصادرات والمزودات في بيانات NgModule الوصفية. يؤسس نظام الوحدة الذي ينظم كل تطبيق Angular.

درس 1 • حراس المسار وحلّات البيانات

يحمي المسارات بحراس CanActivate وCanDeactivate ويحمل البيانات مسبقاً باستخدام Resolve. يضمن التنقل الآمن والبيانات المحملة مسبقاً قبل تقديم المكون.

درس 2 • المسارات الفرعية والمنافذ المسماة

يدمج مسارات فرعية داخل وحدات الميزات ويستخدم منافذ مسماة للمشاهد المساعدة. يدعم التخطيطات المعقدة مثل لوحات المعلومات مع الألواح الجانبية.

درس 3 • التحميل الكسول لوحدات الميزات

يقسم التطبيق إلى وحدات ميزات محملة بشكل كسول لتقليل حجم الحزمة الأولية. يحسن مباشرة مقاييس الأداء المغطاة في الفصول المتقدمة.

درس 4 • معاملات المسار وسلاسل الاستعلام

يقرأ مقاطع المسار الديناميكية ومعاملات الاستعلام الاختيارية باستخدام ActivatedRoute. يتيح عرض التفاصيل والقوائم المصفاة المدفوعة بحالة URL.

درس 1 • الأنبوب غير المتزامن والتكامل مع القالب

يشترك في observables مباشرة في القوالب باستخدام الأنبوب غير المتزامن، مما يلغي إدارة الاشتراك اليدوي. يقلل من الكود النمطي ويمنع تسربات الذاكرة في المكونات.

درس 2 • الـ Subjects والإرسال المتعدد

يستخدم Subject وBehaviorSubject وReplaySubject لإرسال القيم إلى عدة مشتركين. يتيح أنماط الحالة المشتركة المستخدمة في إدارة الحالة القائمة على الخدمة.

درس 3 • مشغلات RxJS الأساسية

يطبق map وfilter وswitchMap وmergeMap وcatchError لتحويل ودمج التدفقات. يزود الطلاب بمتطلبات تحويل البيانات الواقعية.

درس 1 • محاكاة HTTP في التطوير

يستخدم HttpClientTestingModule وواجهة برمجة تطبيقات ويب في الذاكرة لمحاكاة استجابات الخلفية أثناء التطوير. يفصل تقدم الواجهة الأمامية عن توفر الخلفية.

درس 2 • استراتيجيات معالجة الأخطاء وإعادة المحاولة

يعالج أخطاء HTTP باستخدام مشغلات catchError وretry وretryWhen لاستدعاءات API مرنة. يضمن التدهور السلس وملاحظات خطأ سهلة الاستخدام.

درس 3 • معترضات HTTP

ينشئ معترضات لإرفاق رموز المصادقة وتسجيل الطلبات وتحويل الاستجابات عالمياً. يركز الاهتمامات العرضية لـ HTTP دون تعديل استدعاءات الخدمة الفردية.

درس 4 • إعداد HttpClient وطلبات GET

يستورد HttpClientModule ويحقن HttpClient وينفذ طلبات GET مكتوبة. يؤسس خط الأساس لجميع اتصالات الخلفية في التطبيق.

درس 1 • النماذج الديناميكية مع FormArray

يدير قوائم متغيرة الطول من عناصر التحكم باستخدام FormArray لسيناريوهات النماذج الديناميكية. يدعم حالات الاستخدام مثل إضافة عناوين أو بنود متعددة.

درس 2 • أساسيات النماذج التفاعلية

ينشئ النماذج برمجياً باستخدام FormControl وFormGroup وFormBuilder. يتيح منطق نموذج قابل للتطوير والاختبار مدفوع بالكامل من فئة المكون.

درس 3 • تجربة المستخدم للنموذج وسهولة الوصول

يطبق حالات touched وdirty وpristine للتحكم في رؤية الخطأ وتحسين تجربة المستخدم للنموذج. يضمن أن النماذج تلبي معايير سهولة الوصول مع سمات ARIA المناسبة.

درس 4 • مدققات مخصصة والتحقق غير المتزامن

يكتب مدققات مخصصة متزامنة وغير متزامنة لفحوصات عبر الحقول ومن جانب الخادم. يوسع نظام التحقق من Angular لتلبية قواعد الأعمال المعقدة.

درس 1 • أساسيات إدارة الحالة

ينفذ حالة قائمة على الخدمة باستخدام BehaviorSubject ويقدم مفاهيم متجر NgRx للحالة القابلة للتطوير. يعد الطلاب لاختيار استراتيجية الحالة المناسبة لتعقيد التطبيق.

درس 2 • التوجيهات والأنابيب المخصصة

يبني توجيهات سمات قابلة لإعادة الاستخدام باستخدام HostListener وHostBinding، وينشئ أنابيب مخصصة نقية وغير نقية. يوسع قدرات قالب Angular للاحتياجات الخاصة بالمجال.

درس 3 • إسقاط المحتوى والمكونات الديناميكية

يستخدم ng-content للإسقاط أحادي ومتعدد الفتحات وينشئ المكونات ديناميكياً في وقت التشغيل. يتيح مكونات مكتبة واجهة مستخدم عالية المرونة وقابلة لإعادة الاستخدام.

درس 4 • استراتيجيات اكتشاف التغيير

يقارن اكتشاف التغيير الافتراضي و OnPush، ويطبق OnPush مع البيانات غير القابلة للتغيير وobservables. يقلل بشكل كبير من عمليات إعادة التقديم غير الضرورية في أشجار المكونات الكبيرة.