نظرة عامة على Vue.js

Vue هو مشروع مثير للإعجاب للغاية. إنه إطار عمل JavaScript شائع جدًا ، ويشهد نموًا هائلاً. إنها بسيطة وصغيرة وفعالة للغاية. تعرف على المزيد حول هذا الموضوع


Vue هو إطار عمل JavaScript شائع جدًا للواجهة الأمامية ، ويشهد نموًا هائلاً.

إنه بسيط وصغير (حوالي 24 كيلوبايت) وفعال للغاية. يبدو الأمر مختلفًا عن جميع أطر عمل JavaScript الأمامية ومكتبات العرض الأخرى. دعنا نتعرف على السبب.

أولاً ، ما هو إطار عمل الواجهة الأمامية لجافا سكريبت؟

إذا لم تكن متأكدًا من ماهية إطار عمل JavaScript ، فإن Vue هي المواجهة الأولى المثالية مع واحد.

يساعدنا إطار عمل JavaScript في إنشاء تطبيقات حديثة. تُستخدم تطبيقات JavaScript الحديثة في الغالب على الويب ، ولكنها تعمل أيضًا على تشغيل الكثير من تطبيقات سطح المكتب والجوال.

حتى أوائل العقد الأول من القرن الحادي والعشرين ، لم تكن المتصفحات تتمتع بالإمكانيات التي تمتلكها الآن. كانت أقل قوة بكثير ، ولم يكن بناء تطبيقات معقدة بداخلها ممكنًا من حيث الأداء ، ولم تكن الأدوات حتى شيئًا يفكر فيه الناس.

تغير كل شيء عندما كشفت Google النقاب عن خرائط Google و GMail ، وهما تطبيقان يعملان داخل المتصفح. جعل Ajax طلبات الشبكة غير المتزامنة ممكنة ، وبمرور الوقت بدأ المطورون في البناء فوق منصة الويب ، بينما عمل المهندسون على النظام الأساسي نفسه: المتصفحات ، ومعايير الويب ، وواجهات برمجة تطبيقات المتصفح ، ولغة JavaScript.

كانت مكتبات مثل jQuery و Mootools أول المشاريع الكبيرة التي بنيت على JavaScript وكانت شائعة بشكل كبير لفترة من الوقت. لقد قدموا أساسًا واجهة برمجة تطبيقات أجمل للتفاعل مع المتصفح وقدموا حلولًا للأخطاء والتناقضات بين المتصفحات المختلفة.

كانت الأطر مثل Backbone و Ember و Knockout و AngularJS هي الموجة الأولى من أطر JavaScript الحديثة. الموجة الثانية ، وهي الموجة الحالية ، لها React و Angular و Vue كجهات فاعلة رئيسية.

لاحظ أن jQuery و Ember والمشاريع الأخرى التي ذكرتها لا تزال تُستخدم بكثافة وتتم صيانتها بنشاط ، وتعتمد عليها الملايين من مواقع الويب. ومع ذلك ، تتطور التقنيات والأدوات ، وبصفتك مطور JavaScript ، فمن المحتمل أن تكون مطالبًا الآن بمعرفة React أو Angular أو Vue بدلاً من تلك الأطر القديمة.

تلخص الأطر التفاعل مع المتصفح و DOM. بدلاً من التلاعب بالعناصر من خلال الرجوع إليها في DOM ، نحنبشكل تصريحيتعريفهم والتفاعل معهم على مستوى أعلى.

استخدام إطار عمل يشبه استخدام لغة البرمجة C بدلاً من استخدام لغة التجميع لكتابة برامج النظام. يشبه استخدام الكمبيوتر لكتابة مستند بدلاً من استخدام آلة كاتبة. إنه مثل امتلاك سيارة ذاتية القيادة بدلاً من قيادة السيارة بنفسك.

حسنًا ، ليس بعيدًا ، لكنك حصلت على الفكرة. بدلاً من استخدام واجهات برمجة التطبيقات منخفضة المستوى التي يوفرها المتصفح لمعالجة العناصر ، وبناء أنظمة معقدة للغاية لكتابة تطبيق ،تستخدم أدوات تم إنشاؤها بواسطة أشخاص أذكياء جدًا تجعل حياتنا أسهل.

شعبية Vue

ما مدى شعبية Vue.js؟

كان Vue:

  • 7600 stars on GitHub in 2016
  • 36700 stars on GitHub in 2017

ولديه أكثر من 100.000+ نجمة على GitHub ، اعتبارًا من يونيو 2018.

يتزايد عدد تنزيلات npm كل يوم ، وهو الآن يصل إلى 350.000 عملية تنزيل أسبوعيًا.

أود أن أقول أن Vue هومعروف جدابالنظر إلى هذه الأرقام.

من الناحية النسبية ، يحتوي على نفس عدد نجوم React على GitHub تقريبًا ، والتي ولدت قبل سنوات.

الأرقام ليست كل شيء بالطبع. الانطباع الذي لدي عن Vue هو أن المطورينحبهو - هي.

كانت النقطة الرئيسية في زمن صعود Vue هي الاعتماد في نظام Laravel البيئي ، وهو إطار عمل تطبيقات ويب PHP شائع بشكل كبير ، ولكن منذ ذلك الحين انتشر بين العديد من مجتمعات التطوير الأخرى.

لماذا يحب المطورون Vue

أولاً ، يُطلق على Vue اسمإطار تدريجي.

هذا يعني أنه يتكيف مع احتياجات المطور. في حين أن الأطر الأخرى تتطلب شراءًا كاملاً من مطور أو فريق وغالبًا ما تريد منك إعادة كتابة تطبيق موجود لأنها تتطلب مجموعة محددة من الاصطلاحات ، فإن Vue تهبط داخل تطبيقك بسعادةscriptعلامة ، لتبدأ بها ، ويمكن أن تنمو مع احتياجاتك ، وتنتشر من 3 أسطر لإدارة طبقة العرض بأكملها.

لا تحتاج إلى معرفة webpack أو Babel أو npm أو أي شيء لتبدأ مع Vue ، ولكن عندما تكون جاهزًا ، فإن Vue تجعل من السهل عليك الاعتماد عليها.

هذه نقطة بيع رائعة ، خاصة في النظام البيئي الحالي لأطر عمل JavaScript الأمامية والمكتبات التي تميل إلى عزل الوافدين الجدد والمطورين ذوي الخبرة الذين يشعرون بالضياع في محيط من الاحتمالات والاختيارات.

ربما يكون Vue.js هو إطار الواجهة الأمامية الذي يسهل الوصول إليه. بعض الناس يطلقون على Vue اسممسج جديد، لأنه يدخل التطبيق بسهولة عبر علامة البرنامج النصي ، ويكسب مساحة تدريجية من هناك. فكر في الأمر على أنه مجاملة ، حيث سيطر jQuery على الويب في السنوات القليلة الماضية ، ولا يزال يقوم بعمله على عدد كبير من المواقع.

يختار Vue من أفضل الأفكار. لقد تم إنشاؤه من خلال اختيار أفضل أفكار الأطر مثل Angular و React و Knockout ، وعن طريق اختيار أفضل الخيارات التي اتخذتها تلك الأطر ، واستبعاد بعض الأطر الأقل ذكاءً ، فقد بدأ نوعًا ما كمجموعة "الأفضل" ونمت من هناك.

أين تضع Vue.js نفسها في مشهد أطر العمل

الفيلان الموجودان في الغرفة ، عند الحديث عن تطوير الويب ، هماتتفاعلوالزاوي. كيف تضع Vue نفسها بالنسبة لهذين الإطارين الكبيرين والشعبيين؟

تم إنشاء Vue بواسطة Evan You عندما كان يعمل في Google على تطبيقات AngularJS (Angular 1.0) وولد بسبب الحاجة إلى إنشاء تطبيقات أكثر أداءً. اختار Vue بعضًا من بناء جملة Angular Template ، لكنه أزال المكدس المعقد الذي يتطلبه Angular ، وجعله فعالاً للغاية.

حل Angular (Angular 2.0) الجديد أيضًا العديد من مشكلات AngularJS ، ولكن بطرق مختلفة جدًا ، ويتطلب شراءتيبسكريبتالتي لا يستمتع بها جميع المطورين (أو يرغبون في التعلم)

ماذا عن React؟ أخذت Vue العديد من الأفكار الجيدة من React ، وأهمها Virtual DOM. لكن Vue يطبقها بنوع من إدارة التبعية التلقائية ، والتي تتعقب المكونات التي تتأثر بتغيير الحالة بحيث يتم إعادة تقديم تلك المكونات فقط عندما تتغير خاصية هذه الحالة. في React من ناحية أخرى ، عندما يتغير جزء من الحالة التي تؤثر على مكون ، ستتم إعادة تصيير المكون وافتراضيًا سيتم عرض جميع توابعه أيضًا. لتجنب ذلك ، تحتاج إلى استخدام طريقة shouldComponentUpdate لكل مكون وتحديد ما إذا كان يجب إعادة عرض هذا المكون. يمنح هذا Vue القليل من المزايا من حيث سهولة الاستخدام ومكاسب الأداء خارج الصندوق.

أحد الاختلافات الكبيرة مع React هو JSX. بينما يمكنك استخدام JSX تقنيًا في Vue ، إلا أنه ليس أسلوبًا شائعًا وبدلاً من ذلك يتم استخدام نظام القوالب. أي ملف HTML هو نموذج Vue صالح ، في حين أن JSX يختلف تمامًا عن HTML وله منحنى تعليمي للأشخاص في الفريق الذين قد يحتاجون فقط إلى العمل مع جزء HTML من تطبيقك ، مثل المصممين. تتشابه قوالب Vue كثيرًا مع Moustache و Handlebars (على الرغم من اختلافهما من حيث المرونة) وعلى هذا النحو ، فهي أكثر دراية للمطورين الذين استخدموا بالفعل أطر عمل مثل Angular و Ember.

تتبع مكتبة إدارة الدولة الرسمية ، Vuex ، بنية Flux وهي تشبه إلى حد ماإعادةفي مفاهيمه. مرة أخرى ، هذا جزء من الأشياء الإيجابية حول Vue ، التي رأت هذا النمط الجيد في React واستعارته في نظامها البيئي. وبينما يمكنك استخدام Redux مع Vue ، فإن Vuex مصمم خصيصًا لـ Vue وأعماله الداخلية.

Vue مرن ولكن حقيقة أن الفريق الأساسي يحتفظ بحزمتين مهمتين جدًا لأي تطبيق ويب مثل التوجيه وإدارة الحالة تجعله أقل تجزئة من React على سبيل المثال:vue-routerوvuexهي مفتاح نجاح Vue. لا داعي للاختيار أو القلق إذا كانت المكتبة التي اخترتها ستتم صيانتها في المستقبل وستواكب تحديثات إطار العمل ، وكونها رسمية فهي مكتبات الانتقال الأساسية لمكانها (ولكن يمكنك اختيار ذلك استخدم ما تريد ، بالطبع).

الشيء الوحيد الذي يضع Vue في دلو مختلف مقارنةً بـ React و Angular هو أن Vue هوإينديالمشروع: لا تدعمه شركة ضخمة مثل Facebook أو Google. بدلاً من ذلك ، يتم دعمه بالكامل من قبل المجتمع ، والذي يعزز التنمية من خلال التبرعات والجهات الراعية. هذا يضمن أن خارطة طريق Vue ليست مدفوعة بأجندة شركة واحدة.

تحميل مجانيكتيب Vue


المزيد من دروس vue: