بررسی چارچوب‌های جاوا اسکریپت از نظر محبوبیت و بازار کار در ایران

این مطلب توسط جناب آقای «علی رادمنش» نوشته شده و به دست ما رسیده است. از ایشان بابت نگارش این مطلب سپاسگزاریم.

سرخط مطلب

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

چکیده

از میان ده‌ها چارپوب جاوا اسکریپت سه چارپوب Angular، React و Vue بیشترین محبوبیت و استفاده را دارند. Angular از بقیه باسابقه‌تر است، React کتابخانه‌ها و جامعه‌ی برنامه‌نویسان گسترده ای دارد و Vue به ساده بودن معروف است که باعث شده اخیرا به شدت محبوب شود. بازار کار Angular بیشتر از رقباست اگرچه با افزایش توسعه‌دهندگان، به زودی Vue و به خصوص React هم تقاضای زیادی خواهند داشت.

مقدمه

امروزه با پیشرفت تکنولوژی و سیر صعودی توسعه اپلیکیشن‌ها، انتخاب ابزارهای مناسب برای تولید این برنامه‌ها به یک چالش بزرگ تبدیل شده است. در بحث توسعه‌ی وب سایت (که در این مقاله قصد داریم درباره‌ی آن صحبت کنیم) روند رشد زبان‌ها و چارچوب‌های برنامه‌نویسی بسیار سریع است و این برای کسانی که قصد یادگیری در این حوزه را دارند انتخاب‌های زیادی را پیش رو می‌گذارد. از طرفی باید بازار کار و تقاضای شرکت‌های این حوزه را هم مدنظر قرار داد تا در انتها ساعت‌ها وقت و انرژی ما صرف یادگیری ابزاری که کاربردی نخواهد داشت نشود. با درنظر گرفتن این پارامترها در کنار هم در این مقاله قصد داریم به طور خاص به بررسی جدیدترین تکنولوژی‌هایی که در توسعه وب سایت‌ها در سمت کلاینت به وسیله زبان برنامه‌نویسی جاوا اسکریپت مورد استفاده قرار می‌گیرند بپردازیم. هم‌چنین چارچوب‌هایی که بیشترین تقاضا را از سمت شرکت‌های داخلی در حال حاضر (سال 1397) دارند را بررسی خواهیم کرد. ابتدا با بخش‌های مختلف تشکیل‌دهنده یک وب سایت آشنا می‌شویم.

توسعه وب سایت

در اولین بخش به طور خیلی خلاصه به بخش‌های مختلفی که در توسعه‌ی یک وب سایت دخیل هستند خواهیم پرداخت. دسته‌بندی‌های مختلفی برای توسعه یک وب سایت می‌توان درنظر گرفت اما در یک دسته‌بندی کلی می‌توانیم یک وب سایت را به چهار بخش زیر تقسیم کنیم:

• زبان‌های نشانه‌گذاری: که شامل HTML، CSS، XML است و چیدمان و فرم کلی یک وب سایت را تشکیل می‌دهند.
• اسکریپت‌های سمت کلاینت: این بخش در مرورگرهای وب اجرا می‌شود و به سایت قابلیت تعامل با کاربر می‌دهد.
• اسکریپت‌های سمت سرور: شامل فعالیت‌هایی است که در پشت صحنه صورت می‌گیرد و در تعامل با دیتابیس است. این کدها در وب سرور اجرا می‌شود و معماری یک سایت را تشکیل می‌دهد.
• دیتابیس: این بخش مسئول نگهداری داده هایی است که کاربر درخواست می کند، دریافت می کند و یا تغییر می دهد.

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

زبان‌ها و چارچوب‌های اسکریپت‌نویسی سمت کلاینت

زبان اسکریپت‌نویسی یک زیرمجموعه از زبان‌های برنامه‌نویسی است که عموما نیاز به کامپایل شدن ندارد. معروف‌ترین این زبان‌ها JavaScript و PHP هستند که نیاز به کامپایل شدن ندارند. این زبان‌ها، هم در توسعه‌ی سمت کلاینت و هم سمت سرور به کار می‌روند.

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

از معروف‌ترین چارچوب‌های جاوا اسکریپت در حال حاضر می توان به AngularJS، React، VueJS، Meteor.js و Ember اشاره کرد. البته لیست چارچوب‌های موجود بسیار بیشتر از این است و در این مقاله نمی‌گنجد. سه چارچوبی که هم‌اکنون در محبوبیت و استفاده میان توسعه‌دهندگان سرآمد هستند، React، Angular و Vue هستند. هر کدام از این چارچوب‌ها دارای انجمن‌های بزرگ و منابع آموزشی بسیار زیاد هستند. تصویر زیر میزان دانلود آن‌ها را از طریق مدیریت بسته¹ npm  تا ماه اول 2018 نشان می‌دهد:

به وضوح می‌بینیم که React بسیار بالاتر از Angular و Vue قرار دارد. هم‌چنین Vue در سال گذشته نسبت به Angular رشد دو برابری داشته است. اگر تعداد ستاره‌های کسب‌شده در گیت‌هاب ملاک اشتیاق و علاقه توسعه‌دهندگان نسبت به یک تکنولوژی باشد، در این صورت تعداد ستاره‌های این سه چارچوب در ماه آوریل 2018 به این صورت است:

1- React (93 K)

2- Vue (90 K)

3- Angular (53 K)

بنابراین اگر به دنبال یادگیری یک چارچوب برای کسب شغل هستید، بهتر است انتخاب شما یکی از این سه گزینه باشد! ما هم قصد داریم در ادامه به معرفی و مقایسه این سه چارچوب محبوب و پراستفاده‌ی این روزها بپردازیم.

React

React در می 2013 به عنوان یک پروژه متن‌باز معرفی شد. نویسنده‌ی محبوب ترین چارچوب این روزهای جاوا اسکریپت، جردن واک مهندس فیس‌بوک است. تعریفی که در سایت React آمده این است: “یک کتابخانه جاوا اسکریپت برای ایجاد رابط‌های کاربری (User Interfaces)”. دلیل اینکه به جای چارچوب ، از کلمه ی کتابخانه (library) استفاده کرده‌اند این است که React برخلاف Angular یک چارچوب کامل نیست. منظور از کامل بودن به این معناست که مسائلی مانند مسیریابی میان صفحات (Routing)، مدیریت شرایط مختلف (state management)، دریافت داده‌ها (data fetching) و … در react به کتابخانه‌های ثالث واگذار شده است. (از جمله معروف‌ترین این کتابخانه‌ها که جزء جدایی‌ناپذیر react شده‌اند می توان به redux برای مدیریت stateها، react router برای مسیریابی و axios برای دریافت داده‌ها از سرور برپایه‌ی پروتکل HTTP اشاره کرد.)

علاوه بر فیس‌بوک کمپانی‌های بزرگی مثل Netflix، Uber، Airbnb، Twitter، Pinterest، Reddit، Udemy، Wix، Paypal و … از این چارچوب برای توسعه وب سایت‌شان استفاده کرده‌اند.

مزایا:

• به شدت محبوب و دارای بازار کار فعال و گسترده
• وجود منابع آموزشی بسیار زیاد و کتابخانه‌های جانبی که روند توسعه را سرعت می‌بخشند.
• بهترین گزینه برای تیم‌هایی که مبنای توسعه‌ی چندسکویی (cross-platform) دارند (برای وب، موبایل، دسکتاپ و …)
• حمایت‌شده توسط فیسبوک

معایب:

• فراوانی کتابخانه‌های جانبی مورد استفاده در ابتدا کمی گیج‌کننده به نظر می‌رسد
• مدت زمان فراگیری این زبان (همراه با کتابخانه‌های کاربردی‌اش) کمی طولانی است

Angular

AngularJS ابتدا در سال 2010 معرفی شد. نسخه‌ی جدید آن با نام Angular جانشینی برای AngularJS است که در سال 2016 رونمایی شد و جدیدترین نسخه‌ی آن نسخه ی 4 است. یک چارچوب همه‌کاره که به طور پیش‌فرض کارهایی مانند دریافت داده، مدیریت شرایط، زبان برنامه‌نویسی و … را در خود دارد. زبان توسعه‌ی آن TypeScript است که باعث می‌شود برای افرادی که قبلا با زبان‌های برنامه‌نویسی شی‌گرا مثل جاوا یا سی‌شارپ کار کرده‌اند خوشایند باشد و احساس راحتی بیشتری با این زبان داشته باشند. از آن جایی که تیم‌های توسعه‌دهنده در اغلب کمپانی‌های بزرگ به سبک شی گرا کار می‌کنند، این زبان برای شرکت‌ها و پروژه‌های بزرگ مناسب است.

علاوه بر گوگل شرکت‌های دیگری مانند Wix، weather.com، healthcare.gov و Forbes  نیز از این تکنولوژی استفاده می‌کنند.

مزایا:

• یک چارچوب کامل که بخش‌های مختلف پیش‌فرض آن به خوبی تست شده‌اند
• استفاده از زبان TypeScript که شبیه به زبان‌های شی‌گرایی مثل جاوا و سی‌شارپ است
• حامی و توسعه‌دهنده آن شرکت معتبر گوگل است

معایب:

• مدت زمان یادگیری این چارچوب نسبتا طولانی است
• آشنا شدن با TypeScript کمی زمان می‌طلبد
• زمان شروع و بالا آمدن آن (نسبت به رقبا) ضعیف‌تر است

Vue

Vue که به عنوان چارچوب تازه به دوران رسیده! شناخته میشود از سال 2013 معرفی شده است. سازنده و توسعه دهنده‌ی اصلی آن آقای ایوان یو (Evan You) است و برخلاف React و Angular توسط یک کمپانی بزرگ حمایت نمی‌شود و برپایه‌ی همکاری و کمک‌های فردی شکل گرفته و به کار خود ادامه می‌دهد.

شاخص‌ترین ویژگی Vue سادگی آن است. به عقیده‌ی اغلب افراد ساده‌ترین چارچوب برای یادگیری، Vue است. از خیلی جهات شبیه به React است اما مشترکاتی با Angular هم دارد (به عنوان مثال در دستورالعمل‌ها و قالب‌ها). ویژگی مهم دیگر آن توسعه‌پذیر بودنش است. به این معنا که هم می‌تواند به عنوان جایگزینی برای jQuery استفاده شود و هم می‌تواند در برنامه‌های تک‌صفحه‌ای بزرگ مورد استفاده قرار بگیرد.

Angular رویه‌ی مشخصی در مورد موضوعاتی مانند مسیریابی، مدیریت شرایط و … دارد. React هم به کلی این موضوعات را کنار گذاشته و به کتابخانه‌های ثالث واگذار کرده است اما Vue رویه میانه‌ای را در پیش گرفته است. به این صورت که به طور رسمی این مسائل را درنظر گرفته است اما آن‌ها را کاملا اختیاری قرار داده و دست توسعه‌دهنده را برای استفاده از کتابخانه‌های دلخواه در این موارد باز گذاشته است.

مزایا:

• یادگیری آسان
• اسناد و توضیحات خوب
• ترند شدن در محبوبیت و استفاده
• داشتن بهترین عملکرد نسبت به دو چارچوب دیگر

معایب:

• بازار شغلی پایین نسبت به React و Angular

بازار کار در ایران

با یک بررسی ساده در لیست تقاضا برای توسعه‌دهنده front-end در ایران به این نتیجه می رسیم که بیشترین درخواست شرکت‌ها، توسعه‌دهنده‌ی Angular است، React در جایگاه بعدی قرار می گیرد و Vue هم به دلیل اینکه چارچوب جدیدی است درخواست‌های بسیار کمی دارد. به عنوان مثال با بررسی سایت Jobinja.ir که سایتی معتبر برای معرفی فرصت های شغلی در کشور است تقریبا در تمامی فرصت های شغلی برای برنامه‌نویس front-end، آشنایی یا تسلط بر Angular به عنوان یکی از شرایط استخدام وجود داشت و تنها در شرکت های مطرح‌تر و به‌روزتر نظیر علی‌بابا و کسب و کار نوین ایرانیان آشنایی با دو چارچوب دیگر یعنی React و Vue در کنار Angular جزو شرایط وجود داشت. دلیل اصلی این قضیه عمر بیشتر Angular نسبت به رقبایش است و این باعث شده است شرکت هایی که پایه برنامه شان Angular بوده است به همان روند ادامه بدهند. هم چنین توسعه‌دهنده‌گان Angular در ایران به مراتب بیشتر از دو چارچوب دیگر است. این هم می تواند توجیهی برای بیشتر بودن تقاضا برای این چارچوب باشد، چرا که برای دو چارچوب دیگر توسعه‌دهنده زیادی در حال حاضر وجود ندارد.

جمع بندی

حالا که با هر سه چارچوب به طور اجمالی آشنا شدیم و اشتیاق توسعه‌دهندگان، بازار کار و تقاضا را برای آن‌ها نیز بررسی کردیم شاید این سوال برای شما پیش می آید که “بالاخره کدام چارچوب برای من مناسب است؟”

در حالت کلی می‌توان گفت هر سه چارچوب Angular، React و Vue به اندازه‌ی کافی دارای منابع آموزشی، گروه‌ها و فروم‌های برنامه‌نویسی و کتابخانه‌های جانبی هستند که تقریبا پاسخ‌گوی تمامی سوالات شما خواهند بود. از طرفی از معرفی هر کدام از این چارچوب‌ها چندین سال می‌گذرد و هر سه به پختگی لازم رسیده‌اند و با اطمینان می‌توانید در توسعه‌ی برنامه‌های خود از هر کدام استفاده کنید. اما اگر به جنبه‌های دیگر یادگیری یک تکنولوژی مانند تقاضا و بازار کار، نیازهایی که برای استفاده از آن‌ها داریم هم نگاه کنیم قضیه کمی متفاوت می‌شود. در ادامه برخی سناریوهای ممکن را برای انتخاب بهتر شما آورده‌ایم:

اگر قصد دارید هر چه سریع تر وارد بازار کار و استخدام شوید: بهتر است Angular را انتخاب کنید.

اگر قصد دارید در شرکت‌ها و تیم های بزرگ و روی پروژه‌های بزرگ کار کنید: باز هم بهترین گزینه Angular است.

اگر هدف شما یادگیری یک تکنولوژی برای توسعه چندسکویی (cross-platform) است و در آینده قصد دارید علاوه بر وب سایت به تولید اپلیکیشن موبایل یا دسکتاپ هم بپردازید: می توانید React یا Angular را انتخاب کنید.

اگر پیش‌زمینه برنامه‌نویسی شی‌گرا دارید و قصد دارید به همین شکل ادامه دهید: Angular انتخاب درستی است.

یا اگر عاشق جاوا اسکریپت هستید و دوست دارید هر کاری را با آن انجام دهید! بهترین گزینه برای یادگیری React است.

اگر صرفا دوست دارید تکنولوژی‌های جدید جاوا اسکریپت را امتحان کنید و از همان ابتدا وارد پیچیدگی‌هایش نشوید: Vue گزینه مناسبی است، چرا که یادگیری آن راحت‌تر است.

و اگر هنوز نتوانسته‌اید تصمیم بگیرید بهتر است ابتدا Vue را یاد بگیرید (چون بسیار آسان، ساده و دارای اسناد شفافی است)، سپس به سراغ React بروید و در انتها Angular را یاد بگیرید.

1 Package Manager

مراجع و منابع

1- https://javascriptreport.com/the-ultimate-guide-to-javascript-frameworks/

2- https://medium.com/unicorn-supplies/angular-vs-react-vs-vue-a-2017-comparison-c5c52d620176

3- https://medium.com/javascript-scene/top-javascript-libraries-tech-to-learn-in-2018-c38028e028e6

4- https://rubygarage.org/blog/best-javascript-frameworks-for-front-end

5- https://www.whoishostingthis.com/compare/development/languages/

6- https://www.upwork.com/hiring/development/web-development-languages-101/

7- https://github.com/facebook/react

8- https://github.com/vuejs/vue

9- https://github.com/angular/angular

10- https://jobinja.ir