راهنمای مقدماتی برای شروع کار با آیونیک

تعداد بسیار زیادی مقاله و آموزش پیشرفته از فریمورک جدید و محبوب «آیونیک» یا IONIC وجود دارد، اما پاسخی برای این پرسش ها که برای یادگیری آن از کجا باید شروع کرد؟ پیش نیازهای آن چیست؟ و این که آیونیک چه ساختاری دارد و غیره، وجود ندارد.

این یک آموزش است که هدف آن ارائه ی ابتدایی ترین آموزش از آیونیک می باشد. یک نقطه ی شروع جذاب!

اکوسیستم آیونیک

قبل از این که بخواهیم به سراغ مقدمه ای از آیونیک 4 برویم، بهتر است که با محیط این فریمورک محبوب آشنا شویم. چیزهای زیادی هستند که قبل از یادگیری آیونیک، باید با آن ها آشنایی داشته باشید.

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

در حقیقت آیونیک برای طراحی UI یا ظاهر اپلیکیشن استفاده می شود و انگولار هم ساختار اپلیکیشن را تشکیل می دهد.

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

این موضوعات می توانند کمی برای تازه کاران و افرادی که به تازگی وارد اکوسیستم آیونیک شده اند، گیج کننده باشد. موضوعاتی مثل تعداد زیاد فریم ورک های مشترک و زبان های مورد استفاده برای توسعه به وسیله ی آیونیک:

• Ionic
• Stencil
• Web components
• Angular
• ionic-angular
• React
• Vue
• Cordova
• Capacitor

برای ساده کردن کلیت کار، فکر می کنم که بهتر است توسعه به وسیله ی ایونیک را به چهار بخش اصلی تقسیم کنیم:

1. استفاده از آیونیک بدون دخالت هیچ گونه فریم ورکی

از زمانی که کامپوننت های آیونیک به «وب کامپوننت» تبدیل شده اند، می توانید از آن ها مستقیما در برگه های وب سایت استفاده کنید. نیاز به هیچ گونه کتابخانه، فریمورک یا ابزار خاصی هم ندارید. خیلی راحت می توانید کامپوننت های آیونیک را در کد برگه های وب سایت خود کپی کنید.

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

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

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

یک مطلب که من در اکثر اوقات توصیه می کنم

ایونیک و انگولار در کنار هم بسیار کاربردی هستند. توصیه من این هست که این دو فریم ورک را با هم استفاده کنید. مگر این که واقعا ایده و رویکرد خاص و متفاوتی مد نظرتان باشد. مدت بسیار زیادی است که انگولار در برنامه نویسی مورد استفاده قرار می گیرد. به همین خاطر از ایونیک و انگولار، در کنار هم، پشتیبانی های زیادی صورت می گیرد. مثلا خود Ionic CLI بر پایه ی استفاده ی همزمان از ایونیک و انگولار می باشد. همچنین یک کتابخانه برای ایونیک و انگولار، با نام ionic-angular وجود دارد که با داشتن ابزار های کمکی، توسعه ی اپلیکیشن را به واسطه ی این دو فریم ورک، بسیار اسان می کند.

3. استفاده از آیونیک به همراه Stencil

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

اما به هر حال (چه بدانید Stencil چیست و چه ندانید)، می توانید با استفاده از Stencil اپلیکیشن های موبایلی بسازید. برای ساخت اپلیکیشن، هم می توانید از کامپوننت های آماده ی آیونیک استفاده کنید و هم می توانید با استفاده از Stencil کامپوننت های خودتان را بسازید و از آن ها در اپلیکیشن خود استفاده کنید.

مزیت این نوع رویکرد این است که در پایان کار ساخت اپ، نیازی به گنجاندن فریم ورک ها در پروژه ی اپلیکیشن تان ندارید. زمانی که از یک فریم ورک مثل انگولار در ساخت اپلیکیشن استفاده می کنید، برای اجرای اپلیکیشن بر روی دستگاه، کتابخانه ی فریم ورک باید ابتدا بارگذاری و لود شود. این کار برای اپلیکیشن هایی که با استفاده از Stencil درست می شوند انجام نمی شود و باعث حجم کمتر اپ و سرعت بارگذاری بیشتر آن می شود.

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

4. استفاده از ایونیک همراه با سایر فریم ورک ها

همان طور که می توانید از ایونیک همراه با فریم ورک انگولار بهره ببرید، می توانید از دیگر فریم ورک ها نیز برای آن استفاده کنید. ممکن است که شما مایل به استفاده از فریم ورک Vue با ایونیک باشید ( Ionic/Vue). شاید هم بخواهید از React برای توسعه ی اپلیکشن ایونیکی خود استفاده کنید (Ionic/React).

تنها مشکلی که در این روش وجود دارد، این است که آموزش ها و پشتیبانی های خیلی کمی از استفاده ی هم زمان Ionic/React یا Ionic/Vue وجود دارد. کتابخانه های مفیدی مانند ionic-angular نیز برای این فریم ورک ها وجود ندارد. به همین خاطر یادگیری و استفاده از فریم ورک های دیگری به جز angular مشکل خواهد بود.

یک جمع بندی تا اینجا

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

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

منبع: سایت Joshmorony