مدرب
تقدم هذه الدورة شرحًا عربيًا منظمًا لـ Vue.js يبدأ بالمفاهيم الأساسية وينتقل تدريجيًا إلى الاستخدام العملي. لا يكتفي المسار بالتعريفات؛ بل يربط كل محور بممارسة واختبار وفهم الأخطاء المتوقعة.
ابدأ بالوحدات حسب ترتيبها، ونفّذ الأمثلة على بيئة اختبار، ثم حل التمارين دون نسخ الحل مباشرة. احتفظ بملاحظاتك حول الأخطاء، وأنهِ الوحدات بالمشروع العملي عندما يتوفر.
تعلم Vue 3 كما تُبنى بها التطبيقات الحديثة: من تهيئة المشروع وأدواته، مرورًا بالنموذج العقلي للتصيير والحالة والحالة التفاعلية وتوجيهات القوالب والحسابات المشتقة، ثم المكونات وتواصلها عبر props وemits وفتحات النماذج و v-model وتصميم العقود والتحقق والإتاحة، ثم Composables والحالة عبر provide و inject و Pinia والبيانات غير المتزامنة، ثم التوجيه والبيانات البعيدة واختبار المكونات وحماية المسارات ورحلات المستخدم، وتختتم بالمعمارية المتقدمة والجودة والأداء والاختبارات، والإنتاج والنشر والمراقبة والمشروع الختامي المتكامل.
ماذا ستتعلم؟
لمن هذا المسار؟
لمن يريد إتقان Vue 3 الحديث بالكامل: من أساسيات التفاعلية حتى تطبيق منشور مراقب؛ كل درس يبني على الذي قبله بأمثلة عملية وشيفرة قابلة للتشغيل، مع اختبارات وإتاحة وأداء ورصد في كل خطوة.
تتضمن هذه الدورة 7 وحدات، 42 دروس، و 7:14 ساعات من المواد.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «Reactivity وTemplates» في دورة Vue.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «المكونات والنماذج» في دورة Vue.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «Composables والحالة» في دورة Vue.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «التوجيه والبيانات» في دورة Vue.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «المعمارية والحالة المتقدمة» في دورة Vue.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «الجودة والإتاحة والأداء» في دورة Vue.
[المستوى التأسيسي (Beginner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «تهيئة المشروع والأدوات الحديثة (create-vue)» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى التطبيقي (Practitioner)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «النموذج العقلي للتصيير والحالة في Vue 3» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المتقدم (Advanced)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحالة التفاعلية: ref وreactive» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[المستوى المعماري (Architecture & Security)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «توجيهات القوالب: v-if وv-for وv-bind وv-on» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
[مستوى الإنتاج (Production & Testing)] شرح تفصيلي من الصفر إلى الاحتراف لدرس «الحسابات المشتقة والمراقبة: computed وwatch» ضمن وحدة «نظام التفاعلية (Reactivity: ref/reactive/computed) والقوالب» في دورة Vue.js بالعربية: من الأساسيات إلى التطبيق العملي، مصمم بأسلوب Google Notebook مع ملخص صوتي حواري، وخريطة ذهنية بصرية، وشيفرة برمجية مشروحة، وبطاقات استذكار تفاعلية.
اختبار وحدة «الإنتاج والنشر والمشروع الختامي» في دورة Vue.
الرد على التعليق