یک برنامه نویس عاشق کتاب! درحال حاضر توسعه دهنده فرانت اند (React / React-Native)
سیر توسعه ی اپلیکیشن های موبایل چندسکویی (Cross-Platform Apps)
یکی از بزرگ ترین مشکلاتی که تیم های توسعه دهنده موبایل اپلیکیشن با آن مواجه هستند آشنایی و استفاده از تکنولوژی های مختلف است. iOS و اندروید – دو پلتفرم اصلی مورد استفاده در موبایل ها – زبان های متفاوتی را پشتیبانی می کنند. برای iOS اپل از Swift و Objective-C پشتیبانی می کند و برای توسعه ی اپلیکیشن های اندروید، از زبان های جاوا و Kotlin استفاده می شود.
اما تفاوت های این دو پلتفرم به همین جا ختم نمی شود. ابزارهای توسعه ی اپلیکیشن در این پلتفرم ها و حتی واسط هایی که برای ارتباط با عملکردهای مهم موبایل استفاده می شوند هم با یکدیگر تفاوت دارند. توسعه دهندگان اپلیکیشن برای هر کدام از این پلتفرم ها مجبورند نحوه ی دستیابی به این ماژول ها (مثل دسترسی به دوربین، دریافت اطلاعات جغرافیایی و ...) را جداگانه یاد بگیرند.
دشواری یادگیری دو محیط کاملا متفاوت از یکدیگر باعث شد این ایده به ذهن توسعه دهندگان برسد که بتوانند با یادگیری یک زبان، یک تکنولوژی و یک ابزار بتوانند برای هر دو پلتفرم اندروید و iOS اپلیکیشن بنویسند.
در ادامه می خواهیم نگاهی بیندازیم به تلاش هایی که برای توسعه ی اپلیکیشن های مولتی پلتفرم صورت گرفته است.
اپلیکیشن های هیبریدی (Hybrid Apps)
اولین تلاش ها برای دستیابی به این هدف اپلیکیشن های قدرت گرفته از WebView بودند. این برنامه ها کد native (یا مختص به پلتفرم اندروید یا iOS) خیلی کمی دارند و به این صورت هستند که شما با استفاده از HTML، CSS و (JS (JavaScript برنامه ای را روی یک مرورگر وب اجرا می کنید. از آن جایی که این وب اَپ ها با واسط native در ارتباط هستند می توانند به ویژگی های دستگاه مثل دوربین دسترسی داشته باشند.
ابزارهایی مثل Cordova، PhoneGap و ionic این امکان را به توسعه دهندگان می دهند تا این برنامه های اصطلاحا هیبریدی را تولید کنند. برتری اپ های هیبریدی این است که می توان به جای یادگیری دو تکنولوژی مجزا برای توسعه اندروید و iOS، فقط با استفاده از دانش وب اپلیکیشن موبایل توسعه داد.
اما نقطه ضعف این برنامه ها این است که عملکرد آنها هرگز به راحتی و روان بودن یک اپلیکشن native اندروید یا iOS نیست! و دسترسی های محدودی دارند و از طرفی عملکرد ضعیف و کند آنها اصلا تجربه ی خوبی برای کاربران رقم نمی زند! بنابراین وب اپ ها گزینه ی مناسبی برای توسعه برنامه های متوسط و سنگین نیستند.
زامارین (Xamarin)
یکی دیگر از تلاش های جدی برای رسیدن به هدف "توسعه چندسکویی اپلیکیشن" (cross-platform development) فریمورک Xamarin بود.
زامارین در سال 2011 ایجاد شد، در سال 2012 Xamarin Mac را معرفی کرد که پلاگینی برای توسعه اپ برای سیستم عامل macOS بر پایه ی زبان C# بود. در سال 2013 نسخه ی 2 زامارین معرفی شد که در آن IDE یا محیط برنامه نویسی مخصوص خود همراه با نسخه ی سازگار با Visual Studio برای توسعه ی اپلیکیشن برای اندروید، iOS و ویندوز بود! در سال 2016 نیز اعلام شد مایکروسافت شرکت Xamarin را به مالکیت خود در آورده است.
زامارین حرکت بزرگی به سمت توسعه ی اپلیکیشن برای هر دو پلتفرم بود و هم اکنون هم کم و بیش از آن برای توسعه ی اپلیکیشن استفاده می شود. شخصا تا به حال از این فریمورک و به کلی از C# استفاده نکرده ام اما با یک جستجوی ساده می توانیم پی ببریم مشکلات اصلی این فریمورک کند بودن برنامه نسبت به برنامه های native، حجم بالای اپ های خروجی و زمان بر بودن پیاده سازی رابط کاربری (UI) برای اپلیکیشن ها است.
داستان شکل گیری React Native
کم کم به قسمت جذاب داستان نزدیک می شویم!
همان طور که می دانید فیسبوک یک کمپانی متشکل از تعداد زیادی توسعه دهنده وب است و از طرفی تیم های توسعه دهنده موبایل اپلیکیشن (هم برای اندروید و هم برای iOS) دارد. از آن جایی که ارتباط این دو تیم با یکدیگر، تلاش برای یکسان بودن برنامه های خروجی روی دو پلتفرم و ... مشکلات زیادی برای این کمپانی به همراه داشت، آنها به این فکر رسیدند که فریمورکی توسعه بدهند که هم بتوانند با استفاده از یک تکنولوژی برای هر دو پلتفرم اپلیکیشن تولید کنند و هم از پتانسیل توسعه دهندگان وب خود استفاده کنند.
از طرفی فیسبوک در سال 2013 کتابخانه ی react را منبع باز (Open-Source) کرده بود. React یک کتابخانه ی جاوااسکریپت برای ایجاد رابط کاربری (User interface) است که همین دو هفته ی پیش (یعنی 12 نوامبر) اولین نسخه ی stable یا پایدار آن (بعد از گذشت 5 سال) معرفی شد.
بنابراین مهندسان فیسبوک دست به کار شدند و از همان سال 2013 که react معرفی شد شروع به خلق فریمورکی با استفاده از این کتابخانه ی فوق العاده کردند که در سال 2015 اولین نسخه ی آن معرفی شد: React native!
فریمورک React Native در وب سایت رسمی اش به این صورت معرفی شده است:
فریمورکی برای تولید اپلیکیشن های native با استفاده از جاوااسکریپت و react
(و منظور از اپلیکیشن native برنامه ای است که مختص یک پلتفرم خاص تولید می شود و می تواند به طور کامل از ویژگی های آن پلتفرم استفاده کند. مثل اپلیکشن native اندروید یا iOS و یا ویندوز. دلیل بیان آن به این صورت صرفا جهت تمایز با web app ها و mobile cloud app هاست.)
این دو محصول از پروژه ی فیسبوک اُپن سورس (Facebook Open Source) یعنی کتابخانه ی react و فریمورک react native از زمان معرفی تا الان (یعنی نوامبر 2018) رشد خیره کننده ای داشته اند و توسعه دهندگان بسیاری از آن ها برای توسعه وب و موبایل اپلیکیشن استفاده کرده اند.
از معروف ترین شرکت های استفاده کننده از react می توان به نام های بزرگ زیر اشاره کرد:
- Netflix: بزرگ ترین سرویس پرداختی پخش ویدیو
- Yahoo!: یکی از بزرگ ترین موتورهای جستجو که از react در سرویس ایمیل خود استفاده کرده است.
- Sberbank: بزرگ ترین بانک روسیه
- Facebook, WhatsApp, Instagram: کاملا واضح است که فیسبوک از کتابخانه ای که خود تولید کرده است در محصولاتش استفاده کند!
- Atlassian: خالق Jira، BitBucket، HipChat و ... (ابزارهای توسعه ی تیمی)
هم چنین ببینید تعدادی از معروف ترین شرکت هایی را که از react native برای توسعه ی اپلیکیشن موبایل خود استفاده می کنند:
- Facebook: فیسبوک در بخشی از اپلیکیشن اصلی خود و تمام اپلیکیشن Facebook Ads از react native استفاده کرده است.
- Instagram: اینستاگرام که متعلق به فیسبوک است نیز به چالش استفاده از react native جواب مثبت داده است. البته فقط بخشی از این اپلیکیشن با استفاده از این فریمورک پیاده سازی شده است.
- Walmart: والمارت بزرگ ترین خرده فروشی دنیاست که قبلا تجربه ی موفقی در استفاده از Node.js داشته است و بار دیگر به جاوااسکریپت اعتماد کرده است و اپلیکیشن موبایل خود را با react native توسعه داده است.
- Bloomberg: یکی از بزرگ ترین سرویس های خبری دنیا که روزانه ی میزبان حجم عظیمی از محتوا است نیز از react native استفاده می کند.
- Uber: اوبر بزرگ ترین سرویس آنلاین درخواست تاکسی در دنیاست. اپلیکیشن UberEATS آنها قدرت گرفته از react native است. این یعنی مهندسان اوبر به قدرت React native پی برده اند و با اطمینان از آن برای توسعه ی اپلیکیشن دیگر خود استفاده کرده اند!
در بالا صرفا تعداد کمی از اپلیکیشن هایی را نام بردم که قدرت گرفته از react native هستند. برای مشاهده ی لیست کامل تری از این اپلیکیشن ها به اینجا مراجعه کنید.
توسعه ی موبایل اپلیکیشن با استفاده از دانش وب!
اگر در فضای توسعه ی وب اپلیکیشن باشید حتما در کنار کتابخانه ی react، نام فریمورک Angular.js و فریمورک Vue.js نیز به گوشتان خورده یا از آن استفاده کرده اید. حالا ارتباط این دو با موبایل اپلیکیشن ها چیست؟
بعد از موفقیتی که Vue.js بدست آورده و محبوبیت زیادی بین توسعه دهندگان وب پیدا کرد، توسعه دهندگان فریمورک Vue Native را برای توسعه ی موبایل اپلیکیشن معرفی کرده اند. Vue Native نوپاست، اواسط 2018 معرفی شده است، توسط جامعه توسعه دهندگان به وجود آمده است و توسط یک کمپانی بزرگی حمایت نمی شود (درست مثل Vue.js) و در توضیحات آن به طور صریح آمده است که این فریمورک برگرفته از react native است و صرفا یک لایه روی آن است تا توسعه دهندگانی که با Vue.js آشنایی دارند به راحتی بتوانند موبایل اپلیکیشن هم توسعه بدهند. پس این طور می توان گفت که Vue Native نوآوری خاصی ندارد و صرفا همان react native است با زبان (Syntax) متفاوت!
هم چنین به تازگی با فریمورکی آشنا شدم به نام NativeScript که از قضا خیلی هم جدید نیست (بیشتر از 3 سال است که در repository گیت هاب در حال توسعه ی آن هستند!) و مثل react native که از react استفاده می کند، در این فریمورک می توان از angular، Vue.js، TypeScript و یا خود JavaScript برای تولید موبایل اپلیکیشن استفاده کرد.
شخصا با هیچ کدام از دو فریمورک VueNative و NativeScript کار نکرده ام اما با یک نگاه کلی به تعداد آموزش هایی که برای آن ها وجود دارد، تعداد ستاره هایی که در مخزن گیت هاب خود دریافت کرده اند، تعداد کتابخانه های جانبی توسعه داده شده برای آنها و ... می توان پی برد هیچ کدام به اندازه ی react native محبوب نیستند.
اما در اینجا جا دارد از رقیب نوپا اما قوی react native نیز نام ببریم: Flutter!
ورود گوگل به حوزه ی اپلیکیشن های چندپلتفرمی!
فلاتر در ماه می 2017 (حدود دو سال بعد از معرفی react native) توسط گوگل رونمایی شد. بله گوگل! کمپانی گوگل بعد از تقریبا ده سال که اندروید را معرفی کرد و انقلابی در صنعت توسعه ی موبایل به وجود آورد حالا برای اینکه از دیگر رقبا عقب نماند کیت توسعه ی نرم افزاری (SDK) فلاتر را برای توسعه چندسکویی موبایل اپلیکیشن ها معرفی و منبع باز کرده است.
فلاتر برخلاف react native (که از زبان جاوااسکریپت استفاده می کند) از زبان نه چندان شناخته شده ی dart برای توسعه اپلیکیشن استفاده می کند. از طرفی این SDK اواسط سال گذشته برای اولین بار معرفی شده است، بنابراین هنوز در ابتدای راه است و نباید انتظار داشت به طور گسترده از آن استفاده بشود اما از آن جایی که گوگل که تجربه ی بسیار موفق اندروید را در کارنامه ی خود دارد پشت این قضیه است اصلا نباید این بازیگر جدید را دست کم گرفت. شنیده ها نیز حاکی از این است که فلاتر هیچ دست کمی از react native ندارد و در نوع خود از کارایی بالایی برخوردار است. فقط همان طور که اشاره کردم از آن جایی که این تکنولوژی هنوز نوپاست ممکن است در بعضی بخش ها مانند react native قوی عمل نکرده باشد و هنوز به آن بلوغ و پختگی نرسیده باشد.
شاید بد نباشد به این تصویر هم نگاهی بیندازید که به طور خلاصه سه نسل مختلف توسعه ی موبایل اپلیکیشن ها را مقایسه می کند:
در این نوشته از تلاش هایی که در حوزه ی توسعه ی چندسکویی اپلیکیشن صورت گرفته است و شرکت های بزرگی مثل فیسبوک و گوگل که انصافا کارهای بزرگی هم در این زمینه انجام داده اند صحبت کردیم. اما جالب است بدانید در این راه شرکت مایکروسافت در کنار زامارین (که خیلی موفق نبود) تلاش هایی کرده است و در حال حاضر در حال کار روی پروژه ای به نام ReactXP است. طبق توضیح وب سایت رسمی ReactXP کتابخانه ای برای ساختن اپلیکیشن های چندسکویی با استفاده از React JS و React Native است. اما این سوال پیش می آید که تفاوت آن با react native یا flutter در چیست؟ تفاوت اصلی آن در این است که شما با یک مرتبه برنامه نوشتن می توانید علاوه بر اندروید و iOS برای وب و ویندوز هم اپلیکیشن خود را توسعه دهید. (البته react native قابلیت توسعه برای ویندوز و وب را هم درنظر گرفته است.) جذاب به نظر می رسد! اما باید دید مایکروسافت تا چه اندازه قصد سرمایه گذاری روی این تکنولوژی را دارد و چقدر در این زمینه موفق عمل می کند.
بالاخره کدام تکنولوژی را برای توسعه موبایل اپلیکیشن انتخاب کنیم؟
در انتها می خواهم تجربه ی شخصی ام را برای افرادی که تمایل دارند وارد حیطه ی توسعه ی موبایل اپلیکیشن بشوند بیان کنم.
اگر تا به حال سابقه ی استفاده از زبان های Swift یا جاوا را (به غیر از توسعه ی موبایل اپلیکیشن) داشته اید و تا حد خوبی با زیر و بم این زبان ها آشنایی دارید توصیه می کنم به سمت توسعه ی native اندروید یا iOS بروید.
اما اگر هم چنان علاقه دارید وارد دنیای مولتی پلتفرم شوید می توانید به گزینه های زیر نگاهی بیندازید!
از میان تکنولوژی هایی که برای توسعه ی مولتی پلتفرم در بالا به آنها اشاره کردم انتخاب من در حال حاضر (یعنی انتهای سال 2018) بی شک React Native خواهد بود!
حتی اگر با فریمورک های Angular و Vue.js هم آشنایی دارید باز هم بهتر است از NativeScript استفاده نکنید، چرا که از لحاظ کتابخانه ی جانبی اصلا قابل مقایسه با React Native نیست. البته اگر با Vue.js راحت تر هستید احتمالا VueNative گزینه ی خوبی برای شما باشد، چرا که از تمامی کتابخانه های جانبی React Native پشتیبانی می کند.
البته قبل تر هم اشاره کردم که فلاتر گوگل هم تکنولوژی قدرتمندی است اما به 2 دلیل فعلا گزینه ی مناسبی به نظر نمی رسد: 1 زبان دارت ناشناخته است و برای یادگیری آن زمان بیشتری باید صرف کنید. 2 کتابخانه های جانبی و جامعه ی توسعه دهندگان ضعیف تری نسبت به React Native دارد.
دو رویداد جذاب!
در روزهای آتی دو رویداد جذاب را پیش رو داریم:
اولی وبینار یک ساعته ی "One project. One language. Three apps." که درباره ی React Native و NativeScript است و در تاریخ 6 دسامبر برگزار می شود.
لینک ثبت نام: One project. One language. Three apps
دومی رویداد Flutter Live 2018 است که در آن مهندسان گوگل به رونمایی از ویژگی های جدید فلاتر خواهند پرداخت و در طول سمینار با استفاده از فلاتر یک اپلیکیشن توسعه می دهند! این رویداد در 4 دسامبر برگزار می شود.
لینک ثبت نام: Flutter Live 2018 (با فیلترشکن فعال!)
اگر مشتاق هستید بیشتر درباره ی این دو تکنولوژی بدانید توصیه می کنم در هر دو رویداد ثبت نام کنید. هر دو رایگان هستند و به صورت آنلاین می توانید تماشا کنید.
پی نوشت: در این نوشته از اصطلاحات کتابخانه (Library)، فریمورک (Framework) و کیت توسعه ی نرم افزاری ([Software Development Kit [SDK) استفاده شده است که با هم تفاوت هایی دارند. در یک نوشته ی جداگانه به توضیح این مفاهیم خواهم پرداخت.
امیدوارم مطالب این نوشته برای شما مفید واقع شده باشد. ممنون می شوم با لایک کردن ❤ و به اشتراک گذاشتن نظرات، پیشنهادات و حتی انتقادات تان! به بهتر شدن این مطلب کمک کنید.
مطلبی دیگر از این انتشارات
چی میدونی قبل اینکه reactjs کار کنی؟
مطلبی دیگر از این انتشارات
استفاده از فونت دلخواه در React Native
مطلبی دیگر از این انتشارات
رعایت Best Practice ها در React