ویو جی اس چیست؟


ویو جی اس (vue.js) چیست ؟



به طور خلاصه ویو یک فریمورک برای زبان جاوا اسکریپت هست که با استفاده از این فریمورک فرانت اند یک وبسایت را به راحتی انجام بدید.




هرچند فریمورک های دیگه ای هستند که اینکار رو انجام میدن اما ویو از ویژگی های مهمی برخوردار هست.

مثلا: سرعت بیشتر، حجم فوق العاده کمش، من سینتکس رووانش که کاملا شبیه html هست دوست دارم. هدف اصلی از توسعه ی ویو جی اس ایجاد سایت های spa یا تک صفحه ای بوده، البته سایت های چند صفحه ای هم میشه زد اما تمرکز این فریمورک بیشتر رو spa هست.


اگر به امار استک اورفلو سر بزنید هر روز محبوبیت این فریمورک بیشتر میشه.

angular vs react vs vue
angular vs react vs vue


من خودم به شخصه فقط بخاطر یاد گیری آسون و قدرت این فریمورک رو انتخاب کردم، اگر به سایت ویو سر بزنید یک مقایسه ای بین ویو و فریمورک های دیگه کرده . vue comparation


تمام کد های زده شده و وابسگتی ها موقع رندر شدن صفحه انجام میشه.

با استفاده از این فریمورک به راحتی میشه از scss, sass,less ... استفاده کرد.این فریمورک CLI رسمی خودش رو داره.


یکی دیگه از خوبی های ویو جی اس تیم بزرگ و پشتیبانی خوبشه.


  • توسعه دهنده ی اصلی ویو یکی از کار کنان گوگل در پروژه ی انگیولار بوده که با هدف ترکیب انگیولار و ریکت بوده.
  • برای کار با vue دیگه نیازی به ajax نداریم.
  • این فریمورک توسعه دهنده ی ایرانی هم داره.




اگر بخواهیم بیشتر توضیح بدیم باید به مثال هایی از ویو بپردازیم، برای مثال یکی از کد های ساده ی ویو برای reverse کردن یک متن این هست:


<div id=&quotapp-5&quot> 
    <p>{{ message }}</p>
    <button v-on:click=&quotreverseMessage&quot>Reverse Message</button>
</div>
var app5 = new Vue({
   el: '#app-5',
   data: {
     message: 'Hello Vue.js!'
  }, 
  methods: { 
    reverseMessage: function () { 
      this.message = this.message.split('').reverse().join('')
     }
   }
 });

همونظور که میبینید سینتکس بسیاز روانی داره. یکی از ویژگی های خوب این فریمورک دارا بودن یک فریمورک درونی به نام nuxt.js است که با استفاده از این میتوانیم سایت های چند صفحه ای رو راحت تر بزنیم.

vue + Laravel
vue + Laravel


با کمی تحقیق متوجه میشویم که این فریمورک بسیار با فریمورک لاراول مچ هست(ترکیب این دو تا معجزه میکنه)

ویو همانند ریکت از vd یا virtual DOM استفاده میکنه که یکی از دلایل سرعت بالاش همین هست.


یکی از بدی هی ویو ساپورت نشدن در IE های 8 و پایین تر هست چون از قابلیت های اکما اسکریپت 5 به بالا استفاده میکنه.

نسخه ی فعلی این فریمورک 3 هست که جدیدا منتشر شده.


برای نصب ویو این دستور

npm install vue

و برای نصب CLI این دستور رو میزنیم

npm install -g @vue/cli

یکی دیگه از ویژگی های خوب این فریمورک استفاده از Webpack هست.

با استفاده از ب راحت ترین نحو ممکن اپ های pwa بسازید.


معرفی شرکت هایی که از ویو استفاده میکنند:

  • SaaS Landing Page
  • Wappalyzer
  • Spendesk
  • Moderne
  • Chargebee
  • Laravel Vapor
  • Netlify
  • Yousign
  • Icons8
  • Laravel Tenancy
  • editor.freepik.com


اگر علاقه مند به یادگیری ویو جی اس هستید میتوانید از داکیومنتیشن های سایت ویو استفاده کنید.

v3
v3


ویو جی اس ورژن دو به پایین کمی مشکل در استفاده از تایپ اسکریپت دارد، اما بنا به گفته های سایت ویو، ویو ورژن 3 بر پایه ی تایپ اسکریپت هست که باز سرعت بیشتر و حجم خیلی کمتری نسبت به ورژن های قبلی داره همینظور راه اندازی تایپ اسکریپ بسیاز راحت تر بوده.


ویو حتی برای کد زدن هم راحتی را برای شما آورده است، شما با استفاده از کامپوننت ها میتوانید به کد نویسی خود سرعت ببخشید، هر کامپوونت رو هر جا و در هر صفحه ای خواستید میتوانید استفاده کنید.


خلاصه ی فواید ویو جی اس:

  • مستندسازی خوب
  • لجاجت کمتر، انعطاف‌پذیری بیشتر
  • کارایی
  • روند یادگیری
  • ابزارها
  • جامعه
  • پرفورمنس بالا
  • آینده ی حرفه ای



در حالی که این فریمورک برای توسعه وب بسیار انتخاب مناسبی است اما Vue.js با Weex نیز همکاری دارد. Weex پلتفرمی است که با استفاده از آن می توان اپلیکیشن‌های موبایل را طراحی کرد. Weex توسط گروه علی‌بابا یکی از بزرگ‌ترین شرکت‌های تجارت آنلاین و فروشگاه- پشتیبانی می‌شود. درست است که این پلتفرم به اندازه فریمورکی مانند React-native بالغ نیست اما به شما اجازه می‌دهد با استفاده از Vue.js رابط مربوط به آندروید و آی‌او‌اس را طراحی کرده و آن را رندر کنید.

vue native script
vue native script


اگر weex را کنار بگزاریم، ما همچنین میتوانیم با vue native یا vue native script کد اپ اندرویدی و ایفون بزنیم.


برای این فریمورک ابزار هایی مانند vutify, bootstrap vue, vue material, ... ساخته شده است که در کنار راحتی خود ویو، راحتی بیشتری فراهم بشه

یکی از ویژگی های دوست داشتنی ویو شبهات زیادش به angular1 هست.نسخه ی اول انگولار بسیار پرطرفدار بود و هنوز هم طرفداران بسیاری را دارد. از آنجایی که فریمورک vue شباهت خیلی زیادی به فریمورک انگولار دارد باعث شده که توجه برنامه نویس های انگولار را به خود جلب کند وبسیاری از آنها هم اینک از vue استفاده کنند


برای مثال در انگیولار دستور شرطی اینگونه نوشته میشد:

<div ng-if=&quotvar&quot>...</div>

در ویو جی اس هم اینگونه نوشته میشود :

<div v-if=&quotvar&quot>...</div>


ویو همچنین نسبت به دیگر فریمورک‌ها از انعطاف پذیری بیشتری برخوردار است. هسته اصلی کتابخانه روی لایه View تمرکز دارد که خود آن نیز از یک رویکرد ماژولار استفاده می‌کند در نتیجه می‌توانید از راه‌حل خود در مشکلات دیگر نیز استفاده کنید.


با آرزوی موفقیت :) ♥