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

Vue.js

بناء تطبيق معرض أعمال باستخدام Vue.js

بواسطة أروى عفان، في Vue.js، ‏

تعرفنا في مقال سابق على طريقة بناء موقع ثابت كمعرض أعمال باستخدام تقنيات الويب الأساسية، وسنتعلم في هذا المقال أهم الخطوات التي علينا اتباعها لترقية موقعنا من موقع بسيط إلى تطبيق تفاعلي باستخدام لغة جافا سكريبت وإطار عملها Vu…

إنشاء تطبيق بسيط من خلال 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.js

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

حان الوقت الآن للتعمق أكثر في إطار العمل Vue وإنشاء مكوّن مخصَّص، إذ سنبدأ بإنشاء مكوِّن لتمثيل كل عنصر في قائمة المهام، كما سنتعرّف على بعض المفاهيم المهمة مثل استدعاء المكونات ضمن مكونات أخرى وتمرير البيانات إليها باستخدام …

مدخل إلى إطار العمل Vue.js

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

سنلقي في هذا المقال نظرةً على خلفية إطار العمل Vue.js، وسنتعلمّ كيفية تثبيته وإنشاء مشروع جديد ودراسة بنية المشروع بأكمله مع مكوّناته، بالإضافة إلى كيفية تشغيله محليًا وتجهيزه للبناء. المتطلبات الأساسية: الإلمام بأساسي…

نشر تطبيق Vue.js إلى الإنترنت

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

سنتعلّم في هذا الدرس: تجهيز التطبيق قبل النشر إنشاء موقع جديد على منصة Netlify بالإستناد إلى مستودع GitHub هذا الدرس هو الأخير ضمن سلسلة Vue.js، حيث سنتوّج هذه السلسلة بشرح كيفية نشر التطبيق الوارد في الدر…
سنتعلّم في هذا الدرس: بناء هيكل التطبيق والتعرّف على أجزاءه الرئيسية. تحويل التطبيق الموجود في الدرس السابق إلى تطبيق SPA. سنتعلّم في هذا الدرس كيفية بناء تطبيقات تعتمد على صفحة واحدة فقط (Single Page Appl…

استخدام Vue.js للاتصال بالإنترنت

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

سنتعلّم في هذا الدرس: إنشاء قاعدة بيانات على Google Firebase تنصيب مكتبة الاتصال بالانترنت vue-resource بناء تطبيق باستخدام Vue.js للقراءة والإضافة من وإلى قاعدة البيانات إضافة ميزة تعديل البيانات …

المرشحات Filters والـمخاليط Mixins في Vue.js

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

سنتعلّم في هذا الدرس: المرشّح (Filter). المخلوط (Mixin). سنتابع عملنا في هذه السلسلة مع ميزتين مفيدتين في Vue.js وهما: المرشّحات (Filters) والمخاليط (Mixins). تُعتبر هاتين الميزتين على بساطتهما من المزايا …
سنتعلّم في هذا الدرس: بناء هيكل تطبيق بسيط لشرح أفكار الدرس استخدام إطار العمل Bootstrap استخدام بنى معطيات متقدمة مع عناصر الإدخال النصية المعدِّلات (Modifiers) في Vue.js التعامل مع مربعات …

إنشاء مشاريع Vue.js باستخدام Vue CLI

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

سنتعلّم في هذا الدرس: لماذا Vue CLI؟ إعداد Vue CLI إنشاء مشروع جديد باستخدام Vue CLI نظرة عامة على هيكل المشروع تعديل تطبيق مشاريب حسوب حسب الأسلوب الجديد سنتعرّف في هذا الدرس على Vue …

المزيد حول المكونات في Vue.js

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

سنتعلّم في هذا الدرس: بناء تطبيق نموذجي (مشاريب حسوب). إضافة وسائل تنقيح متطوّرة لتطبيقات Vue.js. المكوّنات المتداخلة. تسجيل المكوّنات محليًّا وتسجيلها على المستوى العام. تحديد المكوّن الذي …

مدخل إلى التعامل مع المكونات في Vue.js

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

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

التعرف بالتفصيل على كائن Vue.js

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

سنتعلّم في هذا الدرس: إنشاء أكثر من كائن Vue.js الوصول إلى عناصر HTML مباشرةً باستخدام ‎$refs الخصائص المحسوبة ضمن كائن Vue.js الخصائص المراقبة ضمن كائن Vue.js تثبيت قالب جديد باستخدام ‎$mou…

الموجهات الشرطية والتكرارية في Vue.js

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

سنتعلّم في هذا الدرس: كتابة شفرات JavaScript مباشرةً ضمن القوالب التصيير الشرطي باستخدام v-if و v-else و v-else-if الفرق بين v-if و v-show تصيير القوائم باستخدام v-for المرور على خاصيات كائن…

استخدام Vue.js للتعامل مع DOM

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

سنتعلّم في هذا الدرس: فهم قوالب Vue.js الوصول إلى البيانات والتوابع من كائنات Vue.js الربط مع السمات Attributes كتابة شيفرة HTML خام التعامل مع الأحداث Events استخدام الربط ثنائي الات…
×
×
  • أضف...