#react
#AngularJS
#VueJs
سلام به دوستان خوب و همکاران محترم یک مقاله به زبان انگلیسی که منصفانه سه کتابخانه یا فریم‌ورک جاوااسکریپ را با هم مقایسه می‌کند را برای دوستان قرار می‌دهم. امیدوارم که مفید واقع شود. این سه عبارتند از Angular نسخه ۵ و React و Vue


https://itnext.io/angular-5-vs-react-vs-vue-6b976a3f9172


@ABlueDeveloper

#FAQ
What is this ?

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

توجه داشته باشید که بسیاری از این سوالات باز هستند و می توانند منجر به بحث های جالبی شوند
مطالب مورد پوشش :‌
#JavaScript #React #VueJs #Angular #NodeJs #AngularJS #Bootstrap #CSS #HTML5 #Sass #Webpack #MongoDB #SQL #GraphQL #CSharp #Golang #Java #ASPNET #ASPNETMVC #NETFramework #Ruby #RubyOnRails #TypeScript #PHP #Android #RESTAPI #DataStructures #DesignPattern #Swift #Agile #Scrum



📌📌 لینک : https://goo.gl/KaMsmK
@fullStackDevs

#VueJs

Vue.js 2.2 complete api cheat sheet

تمام Api های موجود در vue js بهمراه مثال آورده

📌 لینک مطلب

@fullStackDevs

#vuejs
#ReactJs

🔰در این پست می خوایم یه کار خطرناک کنیم و react و vue رو یه مقایسه ای با هم کنیم و reactDeveloper ها و vuejsDeveloper ها رو کلا بندازیم به جون هم😎.

❇️ سال میلادی جدید نزدیکه و تو این پست برای دولوپرهایی که برای سال جدید برنامه ریختن که بلاخره چه فریم وورک یا لایبری UI ای رو یاد بگیرین، میخایم یه مقایسه بین react و vue بزاریم با این عنوان که :
🔹React vs Vue.Which one is the best ini 2021?

🔸هر دوی ری اکت و ویو از لایبری های پرقدرت در زمینه frontEnd هستن که طرفدار های زیادی هم در بین دولوپر ها دارن اما ری اکت طرفدار های بیشتری داره چون عمر ری اکت چند سالی بیشتر از vue هست.

🔹تفاوت React و vue در چیه؟
به این سوال از چند وجه میشه پاسخ داد که در ادامه اونها رو لیست میکنیم.
▫️Background :
▪️ری اکت با هدف رفع نیاز های فیسبوک ساخته شده و تا به امروز غولهای فناوری باعث حفظش شدن. حمایت غولهای فناوری باعث ثبات و اطمینان از آینده ری اکت میشه.

▪️ویو توسط یک دولوپر (Evan You) ساخته شده و هدفش بهبود پرفورمنس js tools ها بوده. اقای Evan هر چی رویکرد خوب داخل انگولار و امبر و ری اکت بوده اورده داخل vue و یه سری ویژگی های خاص مخصوص vue هم بهش اضافه کرده. همه اینکار ها باعث شده که توسعه اپلیکیشن با ویو خیلی راحت و سریعتر بشه.

▫️Performance
▪️وقتی که حرف از مقایسه بین ری اکت و ویو میشه مقایسه کردن از لحاظ پرفورمنس معیار قابل توجه ای نیست از لحاظ پرفورمنس ویو از ری اکت به مقدار ناچیزی بهتره و علاوه بر فیچر های خیلی خوبی که داره حجمش هم کمتره . اما اختلاف شون اونقدر های فاحش نیست که بشه در نظر گرفتش، مخصوصا که هر دو لایبری از روش مشابه ای برای ارتباط با DOM استفاده میکنند.
▫️Community Support for React and Vue
برای هر ابزاری کامیونیتیش حیاتی ترین مسئله هست چون کامیونیتی غنی باعث میشه بقیه افراد به سمتش سوق پیدا کنن .

▪️از اونجایی که ری اکت توسط فیسبوک maintain میشه و دائما در حال اپدیت هست، یه قابلیت اطمینانی رو برای دولوپر هاش به ارمغان میاره.

▪️ویو که توسط کارمند سابق گوگل ساخته شده، فاقد پشتیبانی شدن توسط یه برند خاصه و این مسئله ویو رو انتخاب قابل اعتمادی برای شرکت های فناوری دیگه نمیکنه . علی رغم این باز هم ویو طرفدار های خیلی زیاده داره و این دلیل، مهر تایید محکمیه بر قدرت و راحتی vue.

▫️منحنی یادگیری React و Vue به چه شکله ؟

به طور کلی منحنی یاد گیری یعنی برای پیاده سازی کردن چیزی که تو ذهنتون دارین چقدر باید دردسر بکشین .

▪️توسعه اپلیکیشن با ری اکت وابسته
به third-party هاست. و این گاهی اوقات باعث میشه تا دولوپر ها مجبور باشن ابتدا اطلاعات زیادی بدست بیارن تا فقط بتونن کارهاشونو پیش ببرن.
اما documentation ری اکت خیلی خوب و غنیه و هزاران مقاله و وبلاگ هم میتونین سرتاسر اینترنت پیدا کنین. تا اونچکه که تو ذهنتون دارین رو به کمک ری اکت پیاده سازی کنین.

▪️یادگرفتن ویو خیلی راحته و خیلی سریع بهش عادت میکنین چون همانطور که قبلا تر گفته شد این لایبری هر چی فیچر خوب تو سایر لایبری ها بوده رو اورده تو خودش.همچنین vue داکیومنت خوبی هم داره و بخش FAQ اون سعی داره تا به تمامی سوالات پاسخ بده و سوالها رو بدون پاسخ نذاره. (با این قسمت هنوز کار داریم در ادامه)
از میان ری اکت و ویو بین دولوپر ها ویو developer-friendly تر هست.
▫️Popularity
▪️ری اکت چون توسط فیسبوک پشتیبنی میشه در میان لایبری های جاوااسکریپتی محبوبیت بالایی داره و نقش leader رو بازی میکنه.

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

▫️Documentation
▪️از لحاظ دایکیومنت، داکیومنت ری اکت به مرور در حال بهبوده و تیم ری اکت دائما در تلاش اند تا داکیومنت ری اکت رو بهتر و بهتر کنند در مقایسه با ویو، داکیومنت ویو خیلی structure شده هست.
با تمام حرف های گفته شده بیان به سوال اولمون پاسخ بدیم که :
🔸What is the best choice for 2021?
▪️از نظر توسعه، ری اکت گزینه بهتری برای یادگیری در سال پیش روست و بعد اون ویو در جایگاه دوم قرار داره.

🔹آیا ویو بلاخره موفق میشه تا از پس ری اکت عبور کنه؟
▪️تا اونجایی که میشه پیش بینی کرد بدون شک ویو یکی از رقبایی برای ری اکت خواهد بود که حرفهایی زیادی برای گفتن داره و برای رسیدن vue به پلتفرمی که الان ری اکت هست و کسب این جایگاه زمان زیادی لازمه .
در ادامه گوگل ترند react و vue رو میذاریم .

🔹چرا ری اکت از ویو بهتره ؟
جواب متخصص ها به این سوال این گونه بوده :
▪️ری اکت، مسائل و مشکلات رو به صورت fundamental حل میکنه . البته چرایی وجود این چنین مشکلات اهمیت داره اما از نظر عملکرد و بهینه سازی و سهولت در توسعه، ری اکت در مراتب بالاتری قرار داره.

ادامه در پست بعدی
@fullStackDevs

#Vuejs
#ReactJs
ادامه پست قبلی

🔹Which one Is better for beginners?

▪️تمرکز ویو بروی beginner ها بوده و حتی برای کسایی که میخان ری اکت رو یاد بگیرن توصیه میشه اول ویو رو یاد بگیرن چون بعدا راحتر اکو سیستم ری اکت رو درک میکنند. در ابتدا، نقطه ورود توسعه با ویو راحتره و نیازمند داشتن اطلاعات کمتریه .
▪️ری اکت برای توسعه اپلیکیشن های پیچیده و بزرگ مثل e-commerce ایده آل تره اگر چه ویو هم برای ساختن اپلیکیشن های سبکتر مناسبه.
البته این هنر دولوپره بسته به دانشش چطور از ابزارها استفاده کنه.

❇️ خب این پست رو همین جا تموم می کنیم. اگر نظر داشتین یا فک میکنین که جایی اجحاف شده تو کامنت ها ذکر کنین.

❌ انتشار این پست بدون ذکر منبع کار غیر اخلاقی ایه🙏.
@fullStackDevs

#Quasar
#Vuejs

🔰Quasar

🔸 ویو جی اس یک لایبری برای ساخت رابط کاربری میباشد.
به خودیه خود، ویو جی اس UI Element اختصاصی ای که بتوانیم از آن استفاده کنیم ندارد.
به همین دلیل تعداد زیادی UI framework برای آن ساخته شده است تا از آنها استفاده کنیم.
🔹Quasar
🔸 کوییزار (kwei·zaar) یک Material Design 2 با پرفورمنس بالا که تمامی جوانب فرانت اند را پوشش میدهد برای ویو جی اس میباشد.
وبه کمک آن که تحت لایسنس MIT میباشد و و استفاده از آن ساده بوده و به نوعی مکمل ویو جی اس میباشد.
و میتوانید مجموعه ای از اپ های ریسپانسیو با حداقل کد و کانفیگوریشن تولید کنید.
داکیومنت کوییزار را در اینجا بررسی کنید.
مجموعه ای از UI Component ها و layout المنت ها به همراه helper ها.
🔸 برای استفاده از کوییزار سه روش وجود دارد.
▫️UMD / Standalone
در این روش با اضافه کردن استایل ها و اسکریپت های مورد نیاز از طریق CDN امکان استفاده خواهید داشت.

▫️Quasar CLI
نکته قوت این فریم تلقی میشود و همچنین توصیه میشود که از این روش از کوییزار استفاده کنید.
و از آن میتوانید برای ساخت
▪️ SPAs (single-page apps/websites)
▪️ SSRs (server-side rendered apps/websites)
▪️ PWAs (progressive web apps)
▪️ mobile apps (through Cordova)
▪️Electron apps
استفاده کنید.
و اخرین روش
▫️Vue CLI 3 plugin
که توضیحات آنرا در اینجا میتوانید بررسی کنید

🔹Bootstrapping

🔸 برای ساخت یک Quasar App به کمک Quasar CLI ابتدا باید از نصب بودن نود جی اس ورژن حداقل 8 و npm نسخه حداقل 5 بروی سیستمان مطمئن شوید.
مراحل نصب و استارت پروژه را در لینک قبلی میتوانید دنبال کنید.

🔹About Quasar
🔸 مقصود کلی از این فرم وورک مجموعه ای همه منظوره از کامپوننت ها برای ساختن اپ های مدرن از ساده تا پیشرفته میباشد.
تمامی این کامپوننت ها بروی ویو جی اس ساخته شده و امکان ساخت کامپوننت سفارشی نیز وجود دارد.
همچنین در هنگام توسعه و استفاده از این فریم اگر با مشکلی مواجه شدید سوالات خود را در این فروم و Discord میتوانید بپرسید یا پیدا کنید.


@fullstackDevs

#Vuejs
#ComponentLifeCycleHook

#سوال
🔰چگونه Hook های Child Component را در کامپوننت Parent صدا بزنیم؟

🔸در ویو جی اس به صورت معمولی برای اجرای کدی در زمان صدا زده شدن Hook های کامپوننت Child از روش زیر استفاده میکنیم.

🔹روش نرمال انجام این هدف، emit کردن یک Custom Event در کامپوننت child و Bind کردن یک متد به این Custom Event در کامپوننت Parent است، و بدین تصورت میتوانیم کد مد نظر خودمان را در هنگام صدا شده شدن Hook مربوطه کامپوننت Child اجرا کنیم.
🔹به عوان مثال می خواهیم قطعه کد X در زمانی که Hook mounted کامپوننت Child صدا زده شد، اجرا شود.

`<!-- Child -->
<script>
export default {
mounted () {
this.$emit('onMounted')
}
}
</script><!-- Parent -->
<template>
<Child @onMounted="handleOnMounted" />
</template>`

❇️ اما راه حل ساده و جایگزین دیگری نیز وجود دارد برای این کار کافیست به این شکل عمل کنید :
`<!-- Parent -->
<template>
<Child @hook:mounted="handleOnMounted" />
</template>`


🔸در نتیجه handleOnMounted در زمان call شدن هوک مشخص شده اجرا میشود.

@fullStackDevs