الفئات: العلوم والتكنولوجيا
مستوى: متخصص
اللغة: العربية
دروس مجانية
إعداد المشروع
نقل البيانات إلى الـMutations باستخدام الـPayloads واستخدام mapMutation
1. State & Mutations
مقدمة الدورة التدريبية
فوائد استخدام مكتبة Vuex
إعداد المشروع
ربط المكونات بالـState
استخدام mapState
إدخال Mutations – طريقة تغيير البيانات
نقل البيانات إلى الـMutations باستخدام الـPayloads واستخدام mapMutation
2. وقت التدريب (المشروع)
تنفيذ المشروع
اختيار الإضافة إلى عربة التسوق
3. Getters & Actions
تقديم Getters – طريقة أفضل للحصول على البيانات
تشغيل الكود غير المتزامن باستخدام الـActions
تنظيم المتجر الخاص بك باستخدام الوحدات
الحصول على State/Getter من وحدة أخرى (باستخدام rootState، rootGetters)
4. وقت التدريب (المشروع)
تنفيذ المشروع
ملخص الدورة التدريبية
تعتبر Vue.js واحدة من أشهر أطر العمل لتطوير واجهات المستخدم على الإنترنت، وذلك بسب سهولة تعلمها واستخدامها. وفي ظل تعقيد التطبيقات، تصبح إدارة الحالة بشكل مركزي وفعال ضرورة لضمان تنظيم البيانات. هنا يأتي دور مكتبة Vuex، التي تدير الحالة لـ Vue.js بشكل رسمي، والتي تم تصميمها لإدارة الحالة في تطبيقات Vue.js بشكل شامل وفعال. فتخيل أنك تعمل على تطبيق للتجارة الإلكترونية مزود بالعديد من المكونات مثل سلة المشتريات، قائمة المنتجات، والمستخدمين. دون استخدام أداة فعالة لإدارة الحالة، ستجد نفسك محاطًا بالكثير من الشيفرة المعقدة والمكررة، وبالتالي سيصعب عليك تتبع البيانات وإدارتها بشكل صحيح. حينها يبرز دور Vuex، إذ يوفر نظامًا مركزيًا سهل الاستخدام يتيح لك إدارة البيانات ببساطة وسلاسة، مما يضمن استجابة التطبيق بسرعة وفعالية وييسر تبادل المعلومات بين المكونات المختلفة. من خلال هذه الدورة، ستكتشف إمكانيات Vuex وكيفية استغلالها لتحسين تطبيقاتك. ستتمكن من فهم الأساسيات النظرية والعملية لاستخدام Vuex، وستتعلم كيفية إعداد مشروعك وتطبيق Vuex إليه خطوة بخطوة. كما ستتعرف على كيفية استخدام استخدام أدوات مثل mapState لربط المكونات بالحالة المركزية، وستتمكن أيضاً من تغيير الحالة باستخدام التحويرات، مما يضمن أن البيانات تكون متناسقة ودائمة. ليس هذا وحسب، بل ستتعلم كيفية نقل البيانات إلى التحويرات باستخدام الحمولات، واستخدام mapMutations لتبسيط الشيفرة، مما يعزز من فعالية تطبيقك. علاوةً على ذلك، ستقوم ببناء مشروع عملي لتطبيق ما تعلمته، بدءًا من إعداد المشروع وحتى تطبيق ميزة الإضافة إلى سلة المشتريات، لتفهم بشكل عملي كيف يمكن لـ Vuex تحسين تجربتك كمطور. ستكتشف أيضًا كيفية استخدام المحصّلات (Getters) للحصول على البيانات بطرق أكثر كفاءة، وكيفية تشغيل العمليات غير المتزامنة باستخدام الإجراءات (Actions)، مما يتيح لك تنفيذ العمليات المعقدة دون إبطاء التطبيق. وستتعلم كيفية تنظيم متجرك باستخدام الوحدات، مما يتيح لك مرونة أكثر في إدارة الحالة. بانتهاء الدورة، ستكون قد اكتسبت معرفة وخبرة في استخدام Vuex لإدارة الحالة في تطبيقات Vue.js بكفاءة وفعالية. ستصبح قادرًا على بناء تطبيقات أكثر تنظيماً وسهولة في الصيانة، مما يرفع مستوى كفائتك كمطور ويب محترف ويجعلك جاهزًا لمواجهة تحديات تطوير التطبيقات.
يجب أن يكون لديك معرفه جيدة بالـJavaScript و Vue.js.
مهندس للواجهة الأمامية
117 متعلمين
2 دورة