خب شاید با خوندن این مطالب و تحقیقات خودتون تصمیم گرفته باشید شروع به یادگیری vue.js کنید . اما نمیدونید از کجا !؟
خب اولین چیزی که باید بدونید این که vue در حال حاضر ورژن 2 هست پس بهتره مطالبی که ورژن دو رو اموزش میدن دنبال کنید اما فک نکنید ورژن یک و دو زمین تا آسمون با هم فرق دارن میتونید اموزش های ورژن یک رو هم مطالعه بکنید و بعد قسمت مهاجرت از ورژن یک به دو مطالعه بکنید تا تغییرات رو متوجه بشید .

۱-اولین منبع یادگیری شما داکیومنت خود vue هست .

۲- یکی دیگه از منابع خوب که بروزرسانی هم میشه Awesome vue هست که توی همه زمینه بازم تکرار میکنم همه زمینه ها به شما مطلب معرفی میکنه که از این هم غافل نشید ：
https://github.com/vuejs/awesome-vue
۳-بعضی از دوستان عادت به دیدن فیلم های اموزشی دارن که خوشبختانه دوستان لاراولی در لاراکست اموزش ورژن دو رو به صورت رایگان اماده کردن و شما میتونید در لینک زیر مشاهده کنید که دیدن این فیلم ها هم خالی از لطف نیست ：
http://vuecasts.com/

منتظر منابع دیگه باشید و اگه حس میکنید مطالب مفید هستن به اشتراک بزارید ممنون
#یادگیری

یکی از پلاگین یا کتابخونه هایی که احتمالا توی vue بهش نیاز پیدا میکنید ، پلاگین ارسال درخواست یا request به سایت ها یا سرور های دیگه هست. که معمولا از دو کتابخونه زیر استفاده میشه ：
Axios و vue-resource
https://github.com/mzabriskie/axios
https://github.com/pagekit/vue-resource
در اوایل vue-resource توسط خود تیم vue پشتیبانی میشد که چند وقت پیش اعلام کردن این پلاگین رو دیگه پشتیبانی نمیکنن خودشون ولی همچنان توسط تیمهای دیگه گسترش پیدا میکنه و مشکلی نیست ازش استفاده کنید .
اما خودشون بعد این اتفاقات axios رو پیشنهاد دادن . دیگه انتخاب با خود شماست .

#معرفی #http_request

یکی از ابزار های خوبی که تیم vue برای توسعه دهندگان vue اماده کردن vue devtools هست که یک افزونه برای مرورگر کروم هست و به شما اجازه میده برنامه های اجرا شده رو راحت تر دیباگ کنید و ارور ها رو بهتر رفع کنید ... پس اگه میخواید با vue کار کنید حتما این ابزار رو نصب کنید
لینک افزونه ：
https://chrome.google.com/webstore/detail/vuejs-devtools/nhdogjmejiglipccpnnnanhbledajbpd

#معرفی #یادگیری

یکی از راه کار های یادگیری نگاه کردن به کد های بقیه هست و اگه این کد ها چارچوب و توسط برنامه نویس های معتبر نوشته شده باشن به شما هم الگو میدن . توی این سبک فریم ورک ها معمولا واسه شروع یادگیری از پروژه کوچک مثل todo list میتونید شروع کنید ：
Todomvc.com
و اما اگه دنبال پروژه بزرگ تر و سخت تر از این حرفا میگردید نسخه سایت hacker news رو که با vue و vuex و vue router زدن رو میتونید اینجا ببینید که سمت سرور هم اجرا میشه که یک مثال عالی و کامل هست ：
https://github.com/vuejs/vue-hackernews-2.0
اگه مطالب مفیدبودن به اشتراک بزارید ممنون .
#معرفی #یادگیری

اگه عادت به خواندن یا دیدن فیلم های آموزشی زبان اصلی ندارین و یا خوب متوجه نمیشید بهتر فیلم های آموزشی فارسی واسه شروع انتخاب کنید تا یک آشنایی نسبی داشته باشید تا بهتر این مطالب درک کنید .
پارس کلیک یک سری فیلم آموزشی به صورت رایگان گذاشته که واسه شروع خوبه و دیدنش خالی از لطف نیست . اصل فیلم ها در youtube هست که اونجا می تونید ببینید و واسه حمایتشون از اونجا دانلود کنید که یک بازدید براشون بخوره ، اما اگه دسترسی ندارید به youtube در آپارات و بعضی سایت ها هم افرادی این فیلم ها رو آپلود کردن که جستجو کنید پیداشون میکنید .
https://www.youtube.com/playlist?list=PL3Y-E4YSE4wbxnZDL-CDfIzp7CrdbSQ0U
#یادگیری

سرور ساید رندرینگ در ویو جی اس

#سئو
گوگل و بینگ جاوا اسکرپیت synchronous رو به خوبی ایندکس میکنن . اگه اپلیکیشنتون با یه لودینگ شروع میشه و بعد دیتا رو به صورت ای جکسی میگیره موتور های جست و جوی دیگه صبر نمیکنن که این کار تموم بشه ولی اگه براتون فقط همین دو تا سایت مهم هستن این مورد زیاد مهم نیست

کاربرانی با اینترنت ضعیف
ممکنه کاربراتون از جاهایی باشن که به هر دلیلی به اینترنت پرسرعت دسترسی نداشته باشن ، در این مورد کم کردن سایز اپلیکیشن و تعداد ریکوئست ها برای راحتی کاربر لازمه .
میتونید از (https://webpack.js.org/guides/code-splitting-require/) Webpack’s code splitting استفاده کنید که کاربر مجبور نشه کل اپلیکیشن رو دانلود کنه تا یه صفحه رو ببینه ولی بازم به اندازه یه صفحه html از قبل رندر شده سریع نیست .

شبکه های اجتماعی
ممکنه کاربرها از جاهای مختلف به شما لینک بدن (مثل فیسبوک ، توییتر، تلگرام و ...) که بعد از وارد کردن لینک سرورهاشون یه ریکوئست به سایت شما میزنن و چیزایی مثل title description و ... رو همون پایین لینک نشون میدن که اگه استاتیک باشن همیشه یه چیز ثابت می مونه در بهترین حالت .

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

فریم ورکی توسط کامینیوتی ویو جی اس ساخته شده که کار سرور ساید رندرینگ رو خیلی راحت تر و سریع تر میکنه که اینجا میتونید ببینیدش . https://nuxtjs.org

نویسنده : بردیا راستین
منبع : https://vuejs.org/v2/guide/ssr.html
#یادگیری #معرفی

سایت هایی وجود دارند که تمام مطالب مرتبط با vue رو یکجا جمع میکنن که قصد دارم چند تاشو معرفی کنیم :
1- http://vuejsexamples.com/
2- https://vuejsfeed.com/
3- https://codepen.io/tag/vuejs/
امیدوارم استفاده کنید از مطالبش و اگه شما هم چنین سایت هایی میشناسید به ما معرفی کنید تا به لیست اضافه کنیم .
#معرفی

شاید برای شما هم شده باشه که یک متغییر تعریف کرده و توی html به صورت {{ name }} نشونش داده باشید اما تا صفحه رو رفرش یا بروزرسانی میکنید به خصوص ctrl+f5 میزنید تو لود شدن صفحه متغییر دقیقا به همین صورت
{{ name }}
میبینید توی صفحه ولی با بارگزاری کامل صفحه مقدار متغییر نشون میده شاید شما خوشتون نیاد کاربر هاتون این تجربه رو داشته باشند
اینجاست که دایرکتیو v-cloak به کار میاد . کارش اینه تا زمانی که instance کامل بارگزاری نشده چیزی نمایش نده . استفاده ازش هم خیلی راحت مثل زیر ：
html
<div v-cloak>
{{ message }}
</div>
—---------------—
css
[v-cloak] {
display: none;
}

نکته ： اگه از دایرکتیو v-text و v-html هم استفاده کنید همین کار رو انجام میده .

https://vuejs.org/v2/api/#v-cloak

#یادگیری #نکات #v_cloak

لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

نکته ای که هست هنگامی که شما محصول نهایی خودتون رو میخواهید انتشار بدین و روی سایت قرار بدین اگه فردی رو مرورگر خودش dev tools مخصوص vue رو داشته باشه میتونه مقدار متغییر ها یا اگه ارور داشته باشید رو ببینه که بهتره این امکانات غیر فعال بشه . برای غیر فعال کردن کافیه کد های زیر رو به main.js خود اضافه کنید ：
Vue.config.productionTip = false;
Vue.config.devtools = false;

کد اول ارور ها و راهنمایی ها رو دیگه تو کنسول نمایش نمیده و
کد دوم داخل تب vue که با dev tools اضافه شده مقدار متغییر رو نمایش نمیده امیدوارم مفید بوده باشه ....
اشتراک یادتون نره

لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

#یادگیری #نکات

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

ببخشید اگه این چند وقت خیلی فعال نبودیم ولی دوباره شروع میکنم به گزاشتن مطلب و معرفی ......
و یک خبر خوب اگه مشکله خاصی پیش نیاد و همه چی طبق برنامه پیش بره یک date picker شمسی برای vue دارم اماده میکنم .... اگه به نتیجه رسید همین جا به اشتراک میزارم

لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

شاید پیش اومده باشه در پروژه ها بخواین وقتی که پروژه در حال بارگزاری یا لود اطلاعات هست یک ایکون لودینگ رو به کاربران نشون بدین که الان قصد معرفی همین component رو دارم . بهتره پیشنمایش این component رو ببینید تا بهتر متوجه بشید :
http://greyby.github.io/vue-spinner/
همچین میتونید طبق نیاز خودتون رنگ و سایزش رو شخصی سازی کنید

#معرفی #Loading

لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

سری فیلم اموزشی vue 2 که توسط دوست عزیزمون @Developeer از youtube دانلود و اپلود شده برای دوستانی که مشکل دانلود از youtube رو دارند .
حدود ۴۰ قسمت تا حالا اماده شده که در صورت اومدن قسمت های جدید اون ها هم اضافه میشه .
به تمام ریز و درشت vue پرداخته و در قسمت های اخری کار با router رو شروع کرده ...

#یادگیری

لینک دانلود ：
Ioteam.ir:8080

لینک اصلی یوتوب ：
https://www.youtube.com/watch?v=5LYrN_cAJoA&list=PL4cUxeGkcC9gQcYgjhBoeQH7wiAyZNrYa


لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

چند روز پیش نظرسنجی گذاشتیم تا ببینیم دوستان چه ادیتور یا IDE رو برای برنامه نویسی vue استفاده میکنن که دو ادیتور VsCode و WebStorm(phpstorm) بیشترین رای رو اوردن . حالا سعی داریم به مرور پلاگین هایی رو معرفی کنیم تا کد زدن با این ادیتور ها برای ما راحت تر بشه .
1 – webstorm or phpstorm :
خب چون این نرم افزار ها IDE هستن امکانات زیادی رو با خودشون دارن و ی جورایی نیاز نیست شما اصلا چیزی نصب کنید و اگه از ورژن های اخر اون ها استفاده میکنید خودشون به صورت پیسش فرض از vue پشتیبانی میکنن اما اگه از ورژن های خیلی قدیمی استفاده میکنید این پلاگین ها به شما کمک میکنه :
https://plugins.jetbrains.com/plugin/9442-vue-js
https://plugins.jetbrains.com/plugin/8057-vue-js

2- VsCode Editor :
ادیتوری که خودم استفاده میکنم سبک و با امکانات . اگر توی مخزن پلاگین های این ادیتور سرچ کرده باشید میبینید تعداد زیاد پلاگین واسه vue وجود داره :

https://marketplace.visualstudio.com/search?term=vue&target=VSCode&category=All%20categories&sortBy=Relevance

اما خوب نیازنیست تمام اون ها رو نصب کنید پلاگین Vetur به نظرم بهتر و تکی کلی کار براتون انجام میده که حتما توضیحات نصبش رو بخونید چون یک سری پیشنیاز داره ...

همچنین واسه weex هم پلاگینی وجود داره ! weex همون پروژه ساخت اپ موبایل با vue هست .

یک پلاگین دیگه هم هست به نام vuejs extension pack که اومده پلاگین های خوب رو یک جا جمع کرده و کار آسون کرده که همون vetur هم جزو هست :
https://marketplace.visualstudio.com/items?itemName=mubaidr.vuejs-extension-pack

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

#Editor #ide #plugin

لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

خب cheat sheet ها همونطور که از اسمشون مشخص هست به شما یک دسترسی سریع میدن هرجا گیر کردین ی تقلب کوچک بکنید و کارتون رو حل کنید . توی برنامه نویسی هم cheat sheet های مخصوص خودشو داره که الان cheat sheet vue 2.3 بهتون میخوایم مرفی کنیم .
یک نسخه سایت داره که کامل تره و هر دستور با کلیک کردن یک توضیحی میده و یک نسخه افلاین که به صورت pdf هست .
میتونید چاپ کنید و بزنید به دیوار محل کارتون یا شرکتتون و ازش استفاده کنید .
واسه یادگیری هم خوب چون شاید با خیلی هاش آشنا نباشید !
نسخه سایت :
https://vuejs-tips.github.io/cheatsheet/
نسخه pdf :
https://vuejs-tips.github.io/cheatsheet/vuejs-cheatsheet.pdf


لینک گروه ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال ：
https://telegram.me/vue_js

گزارش State of Vue.js نتیجه یکی از جامع ترین و به روز ترین نظرسنجی ها از توسعه دهنده ها و بیزینس های موفقی هست که از این فریم ورک استفاده می‌کنند.
#چرا_vue

در لینک زیر میتونید خلاصه ای از این گزارش رو مطالعه کنید. که قطعا کمک خوبی برای تصمیم گیری در مورد انتخاب و جلب توجه بقیه هم تیمی هاتون برای این انتخاب میکنه:

https://www.monterail.com/blog/state-of-vuejs-report-summary

#چرا_vue

لینک گروه vue.js ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال vue.js ：
https://telegram.me/vue_js

نسخه کامل ۸۰ صفحه ای State of Vue.js

ممنون از پویا پارسا عزیز برای اطلاع رسانی

#چرا_vue


لینک گروه vue.js ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال vue.js ：
https://telegram.me/v

خب یکی از چیز هایی که معمولا توی مقایسه vue و react گفته میشه و react حرفی واسه گفتن داره ساخت app های موبایل هست که react native یکی از بهترین ها تو این زمینه هست اما نگران نباشید واسه vue هم چنین فریم ورک هایی هست شاید به اون قدرت نه ولی دارن رشد میکنن و نیاز های شما رو ی جورایی ۱۰۰% حل میکنن . الان قصد داریم فریم ورک هایی که واسه vue وجود دارند رو به شما معرفی کنیم ：


مورد اول weex : خب اگه قرار باشه چیزی react native رو بگیره باید منتظر رشد همین بمونیم
https://weex.apache.org

مورد دوم quasar ：یک فریم فروک خوب که فقط واسه vue هست داکیومنت خوبی هم به نظر داره
http://quasar-framework.org

مورد سوم native script : توی توضیحاتی که در سایتشون دادن با vue هم کار میتونید بکنید این فریم ورک هم جا افتاده هست
https://nativescript.org

مورد چهارم framework7 ：
یک فریم ورک خوب و کامل دیگه
که خروجی های خوبی میده روی انیمیشن ها بیشتر همه وقت گذاشتن مثل این که...پس میشه تجربه شبیه به native داشته باشه...
https://framework7.io

مورد پنجم onsen ：این فریم ورک با بقیه فریم ورک ها دیگه مثل react angulsr و ... هم کار میکنه که از vue هم پشتیبانی میکنه
https://onsen.io/vue/

موارد دیگه ای هم هستند ولی بیشتر ui هستند ولی اگر موردی جا افتاده بگید تا به لیست اضافه کنیم.

#vue_mobile_framework #app #mobile



لینک گروه vue.js ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال vue.js ：
https://telegram.me/vue_js

خب امروز قصد معرفی یک پلاگین خوب و باحال برای vue رو داریم
معمولا از این فریم ورک ها واسه ساخت وب اپلیکیشن ها استفاده میشه پس واقعا بییاین و یک اپلیکیشن تحویل بدیم ! پلاگینی که میخوایم معرفی کنیم کارش به این صورت هست که شما میتونید واسه فعالیت هاتون کلید میانبر (short key) تعریف کنید به فرض شما توی داشبورد یک قسمت دارین به نام افزودن مطلب ، به وسیله این پلاگین میتونید یک کد میانبر یا کوتاه به فرض ctrl +n تعریف کنید که تا کاربر زد بره و صفحه افزودن مطلب باز کنه .... یا هر اتفاق دیگه که خودتون مدنظر دارین .
واسه وب اپلیکیشن ها قابلیت خیلی خوبی هست و توی سرعت کار افراد حرفه که با اپ ما کار میکنن میتونه خیلی تاثیر گذار باشه .
امیدوارم به دردتون خورده باشه ：)

لینک گیتهاب پروژه ：
https://github.com/iFgR/vue-shortkey

#short_key #plugin #components

لینک گروه vue.js ：
https://t.me/joinchat/AAAAAEGmHfikBfgSlaOKxA
لینک کانال vue.js ：
https://telegram.me/vue_js