انگولار چیست؟

چه مزایا و ویژگی هایی دارد؟

در میان بازار داغ رقابت فریم ورک های جاوا اسکریپتی در حال حاضر انگولار در کنار ری اکت به یکی از محبوب ترین فریم ورک های جاوا اسکریپتی تبدیل شده است. قابلیت های فوق العاده این فریم ورک و معماری منظم باعث شده است بسیاری از شرکت های معروف دنیا از انگولار استفاده کنند.

فریم ورک انگولار چیست؟

انگولار یک فریم ورک جاوا اسکریپت است که شاید بتوان آن را چیزی فراتر از فریمورک یعنی در حد یک پلتفرم شناخت؛ که برای ساخت و طراحی اپلیکیشن های تحت وب، اندروید و ios و حتی desktop کاربرد دارد. انگولار ابتدا برای ایجاد وبسایت ها تک صفحه ای (Single Page Application) مورد استفاده قرار میگرفت و بدون لود شدن صفحه اطلاعات وبسایت به روز میشد که این باعث سریع تر شدن واکنش وبسایت و جذابیت بالا برای کاربران میشد. انگولار توسط زبان جاوا سکریپت پیاده سازی شده است؛ همین موضوع باعث شده است تا در حین توسعه برنامه ها واپلیکیشن ها توسط انگولار به دانش حداقلی در مورد جاوا اسکریپت و با نحوه کدنویسی آن آشنا باشیم.

شروع انگولار از کجا استارت خورد؟

ابتدا انگولار جی اس (Angular.Js) در سال ۲۰۰۹ توسط میسکو هوری و ادام آبرونز در شرکت گوگل طراحی و عرضه شد. Angular Js پس از معرفی به دلیل کارکردن ساده و قدرت بالایی که داشت به سرعت مورد استقبال بالا قرار گرفت و بسیاری از توسعه دهندگان به Angularjs روی آوردند.

در سال ۲۰۱۶ شرکت گوگل نسخه ی دیگری از انگولار را که Angular 2 بود را منتشر کرد. انگولار در نسخه ی دوم تفاوت های بسیار زیادی با Angular js پیدا کرد به طوری که هسته ی انگولار در نسخه ی دوم به صورت کامل مورد باز نویسی قرار گرفت. Angular 2 پس از انتشار مشکلات زیادی را به همراه داشت، خیلی از امکانات و تنظیمات آن باید به صورت دستی وارد میشد و پس از تکمیل کدنویسی باید به دلیل سرعت پایین و حجم بالای آن باید از طریق webpack حجم آنرا کاهش میدادیم تا در حین اجرا به کندی یا مشکلات از این قبیل که علت آن سنگین بودن Angular2 بود برخورد نکنیم. در اواخر سال ۲۰۱۶ گوگل تغییراتی در این نسخه از انگولار به وجود آورد و این فریم ورک را تا حدی بهبود بخشید.

چیزی نگذشت که در بهار سال ۲۰۱۷ نسخه ی چهارم انگولار (Angular4) منتشر شد. نسخه ی چهارم این فریمورک قابلیت های بهتری نسبت به نسخه یAngular2 و Angular Js داشت در حدی که از هر دو نسخه ی پیشین خود سبقت گرفت. Angular4 از Angular2 سریع تر، راحت تر و کامل تر بود و قابلیت ها و امکانات بیشتری را در خود جای داده بود. پس از انتشار نسخه ی چهارم، پله پله و در بازه های زمانی کوتاهی این فریمورک ارتقا پیدا کرد و اکنون نسخه ی Angular8، آخرین ورژن این فریمورک قدرتمند است که توسعه دهندگان بسیاری در حال استفاده از آن میباشند.

چه چیزهایی در Angular و Angular JS متفاوت است؟

• Angular یک بازنویسی کامل از Angular JS است.

• اپلیکیشن ساخته شده با Angular و ساختار و معماری آن، کاملا با یک اپلیکیشن Angular JS تفاوت دارد. المان های اصلی سازنده ی یک اپلیکیشن Angular، ماژول ها، کامپوننت ها، قالب ها متادیتا، دیتا بایندینگ، دایرکتوری ها، سرویس ها و غیره هستند.

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

• انگولار از یک مفهوم ماژولی استفاده می کند. به عبارت دیگر، ویژگی ها و فانکشنالیتی ها درون ماژل ها قرار می گیرند. این خصوصیت هسته ی انگولار را بسیار بهبود یافته تر می کند. • مفهوم کنترلر مذکور، که در Angular JS استفاده می شد، در ورژن های انگولار 2 و بالا تر وجود ندارد و به جای آن کامپوننت ها تشکیل دهنده ی UI (رابط کاربری) اپلیکیشن هستند. این موضوع به توسعه دهندگان کمک می کند تا اپلیکیشن خود را به بخش های مختلفی تقسیم کنند و این اجازه را می دهد که هر یک از کامپوننت ها، دارای ویژگی های منحصربفرد خود باشند. به دلیل وجود کامپوننت ها در Angular، می توان گفت که انعطاف آن از Angular JS بیشتر است.

• انگولار در ساختار کدنویسی، برای property binding به “[ ]” تکیه دارد و برای event binding از “( )” استفاده می کند.

• برای ساختن یک اپلیکیشن تک صفحه ای که دارای سئوی مناسبی باشد، در Angular JS با مشکلات بزرگی رو برو بودیم که با قابلیت اجرا و تفسیر اپلیکیشن در سرور توسط نسخه ی 2، این مشکلات برطرف شد. بخاطر این ویژگی خوب، باید از ماژول جدید انگولار یعنی Universal ممنون باشیم! انگولار جدید استفاده از زبان برنامه نویسی تایپ اسکریپت را پیشنهاد داد. این موضوع نیز فوایدی را برای Angular دربرداشت:

• تایپ کردن استاتیک

• برنامه نویسی شیء گرا بر پایه ی کلاس ها

• پشتیبانی از کدنویسی واکنش گرا با استفاده از RxJS به وسیله ی پشتیبانی از تایپ اسکریپت، انگولار فواید موجود در ES6 را نیز شامل شد که این فواید به شرح زیر می باشند:

• حلقه های For و If

• dependency injection بهبود یافته در انگولار

• مجری ها یا Iterators

• بازتاب یا Reflection

• بارگذاری پویا

• بارگذاری غیرهمزمان قالب اپلیکیشن

• مسیریابی آسان تر

انگولار چگونه عمل میکند؟

انگولار هر صفحه از وبسایت ما را به یک یا چند کامپوننت تقسیم میکند. هر کدام از این بخش ها یا کامپوننت ها که توسط انگولار پیاده سازی می شوند، خود از سه بخش تشکیل شده اند. بخش اول قالب یا template آن کامپوننت است که خروجی رندر گرفته شده از انگولار در قالب html می باشد. بخش دوم کلاس (class) است که متشکل از متغیر ها و توابع جاوا اسکریپت و دستورات انگولار است و خروجی را به template میفرستد. بخش سوم Meta data نام دارد که به بیان ساده مشخص میکند که کدام class و کدام template کامپوننت ما را تشکیل میدهد. در meta data سلکتور هایی وجود دارد که مانند تگ های html هستند و برای اپلیکیشن ما که با Angular نوشته شده است، مشخص میکند کدام کامپوننت باید اجرا شود. فریم ورک انگولار زبان html را برای ما به نوعی قدرتمند تر میکند و ما با استفاده از آن قادر خواهیم بود تا در دستورات html خود از دستورات شرطی، حلقه ها و data binding استفاده کنیم.

ویژگی های انگولار

استفاده انگولار از تایپ اسکریپت

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

گستردگی انگولار

انگولار فریم ورک بسیار بزرگی است و نسبت به فریمورک vue و کتابخانه react از منابع بیشتری استفاده میکند. به همین دلیل اغلب از Angular در ساخت پروژه های بزرگ استفاده می شود. حجم بالای انگولار در نسخه ی ۲ کمی از محبوبیت این فریم ورک کاست اما در Angular4 به بعد این مشکل کمتر شد وحجم انگولار بهبود پیدا کرد. انگولار از معماری MVVM استفاده میکند و کد های منطق برنامه از کد های view جدا هستند. استفاده از این معماری مزیت های زیادی در کار با انگولار برای ما فراهم کرده است.

پشتیبانی قدرتمند از فریم ورک Angular

فریم ورک انگولار توسط گوگل منتشر شده است و بهترین متخصصین از سر تا سر جهان در این شرکت بزرگ فعالیت میکنند. همین باعث شده که به روز ترین دانش در توسعه ی محصولات این شرکت استفاده شود. فریم ورک Angular js هم از این موضوع بی نصیب نیست. این فریمورک به سرعت در حال بروز رسانی است و در زمانهای خیلی کوتاه نسخه های جدید از آن منتشر می شود. نسخه ی angular2 به دلیل ضعف هایی که در برخی موارد داشت باعث شد تا حد کمی از محبوبیت انگولار کاسته شود اما از بعد از انتشار نسخه ی Angular 4، دوباره این فریم ورک روند صعودی را در پیشرفت و جذب جامعه ی برنامه نویسان را در پیش گرفت.

چه زمانی باید انگولار را استفاده کرد؟

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

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

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

انگولار همچنین برای برنامه‌هایی مناسب است که نیاز دارند در محیط‌های توسعه مختلفی اجرا شوند. اگر شما برنامه‌ای دارید که باید به خوبی برنامه اندروید و ios اجرا شود، می‌توانید با استفاده از NativeScript برنامه ی خود را در یک محیط بومی واقعی موبایل رندر (Render) کنید. در بعضی موارد حتی می‌توانید این کد را بین پلتفرم‌های مختلف به اشتراک بگذارید.