اذهب إلى المحتوى

إنشاء تطبيق بسيط من خلال Vue.js

بواسطة Rbab Alfrasi، في Vue.js،

في هذا الفيديو سننشئ تطبيق بسيط لإدارة المهام من خلال إطار العمل Vue.js بإصداره الثالث. من خلال هذا التطبيق سنشرح الأمور الأساسية في إطار Vue.js وكيفية إنشاء مشروع وقائمة لإدارة المهام. إذا أردت التعرف أكثر عل…
اقتربنا من نهاية سلسلة إطار العمل Vue.js، إذ يجب الآن تعلّم كيفية الوصول إلى العناصر وإدارتها وتعديلها مثل إدارة التركيز أو كيف يمكننا تحسين الشمولية أو إمكانية الوصول لمستخدمي لوحة المفاتيح في تطبيقنا، إذ سنتعرّف على كيفية ا…
حان الوقت الآن لإضافة الوظائف التي تمكّننا من تعديل عناصر المهام الموجودة مسبقًا، لذلك سنستفيد من إمكانات التصيير الشرطي Conditional Rendering في إطار العمل Vue مثل v-if و v-else للسماح بالتبديل بين عرض عناصر المهام الموجودة …
لقد حان الوقت أخيرًا لجعل تطبيقنا يبدو أجمل قليلًا، إذ سنتعرّف في هذا المقال على الطرق المختلفة لتنسيق مكونات إطار العمل Vue باستخدام لغة CSS، كما سنضيف عدّادًا يعرض عدد عناصر المهام المكتملة باستخدام ميزة في إطار عمل Vue تسم…
لدينا الآن عينة من البيانات وحلقة تأخذ كل جزء من هذه البيانات وتصيّره أو تعرضه Render ضمن المكوِّن ToDoItem في تطبيقنا، كما نريد السماح لمستخدِمينا بإدخال عناصر مهامهم في التطبيق، لذلك سنحتاج إلى نص إدخال <input> وحدث ي…

عرض مكونات Vue.js

بواسطة Ola Abbas، في Vue.js،

لدينا حتى الآن مكوِّن يعمل بنجاح، ونحن الآن جاهزون لإضافة عدة مكوّنات ToDoItem إلى تطبيقنا، إذ سنتعلّم في هذا المقال كيفية إضافة مجموعة من بيانات عناصر المهام إلى المكوِّن App.vue التي سنكرّرها ونعرضها ضمن المكونات ToDoItem ب…
حان الوقت الآن للتعمق أكثر في إطار العمل Vue وإنشاء مكوّن مخصَّص، إذ سنبدأ بإنشاء مكوِّن لتمثيل كل عنصر في قائمة المهام، كما سنتعرّف على بعض المفاهيم المهمة مثل استدعاء المكونات ضمن مكونات أخرى وتمرير البيانات إليها باستخدام …
سنلقي في هذا المقال نظرةً على خلفية إطار العمل Vue.js، وسنتعلمّ كيفية تثبيته وإنشاء مشروع جديد ودراسة بنية المشروع بأكمله مع مكوّناته، بالإضافة إلى كيفية تشغيله محليًا وتجهيزه للبناء. المتطلبات الأساسية: الإلمام بأساسي…
سنتعلّم في هذا الدرس: تجهيز التطبيق قبل النشر إنشاء موقع جديد على منصة Netlify بالإستناد إلى مستودع GitHub هذا الدرس هو الأخير ضمن سلسلة Vue.js، حيث سنتوّج هذه السلسلة بشرح كيفية نشر التطبيق الوارد في الدر…
سنتعلّم في هذا الدرس: بناء هيكل التطبيق والتعرّف على أجزاءه الرئيسية. تحويل التطبيق الموجود في الدرس السابق إلى تطبيق SPA. سنتعلّم في هذا الدرس كيفية بناء تطبيقات تعتمد على صفحة واحدة فقط (Single Page Appl…
سنتعلّم في هذا الدرس: المرشّح (Filter). المخلوط (Mixin). سنتابع عملنا في هذه السلسلة مع ميزتين مفيدتين في Vue.js وهما: المرشّحات (Filters) والمخاليط (Mixins). تُعتبر هاتين الميزتين على بساطتهما من المزايا …
سنتعلّم في هذا الدرس: بناء هيكل تطبيق بسيط لشرح أفكار الدرس استخدام إطار العمل Bootstrap استخدام بنى معطيات متقدمة مع عناصر الإدخال النصية المعدِّلات (Modifiers) في Vue.js التعامل مع مربعات …
سنتعلّم في هذا الدرس: بناء تطبيق نموذجي (مشاريب حسوب). إضافة وسائل تنقيح متطوّرة لتطبيقات Vue.js. المكوّنات المتداخلة. تسجيل المكوّنات محليًّا وتسجيلها على المستوى العام. تحديد المكوّن الذي …
سنتعلّم في هذا الدرس: تجهيز هيكل التطبيق على حاسوب محلّي. بناء مكوّن جديد: مكوّن المهام. تحسين تجربة الاستخدام للمكوّن. تمرير وسائط إلى المكوّنات. إنشاء أكثر من نسخة من المكون ضمن نفس الصفحة…

مقدمة إلى Vue.js

بواسطة حسام برهان، في Vue.js،

مرحبًا بك في هذه السلسلة الجديدة التي سنتعلّم من خلالها كيف سنتعامل مع إطار العمل Vue.js. هذا الإطار الواعد الذي يُسهّل العمل في تطوير الواجهة الأمامية للتطبيقات Frontend Applications إلى حدّ بعيد. سنتدرّج في هذه السلسلة…
×
×
  • أضف...