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

چرا من به فریمورک احتیاج دارم؟

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

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

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

معرفی آنگولار: آنگولار چیست؟

زمانی آنگولار جی اس گل سر سبد فریمورک های جاوااسکریپت بود که در سال ۲۰۱۲ توسط کمپانی گوگل عرضه شد و بر مبنای مفهوم مدل-نمایش-کنترل کننده ساخته شده بود.

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

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


<calendar></calendar>

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

موضوع مهم دیگر “تزریق وابستگی” بود که به اجزای اپلیکیشن اجازه می داد تا به یکدیگر متصل شوند و کدهای قابل استفاده ی مجدد و قابل آزمایش بسازند. البته که بیشتر از این حرفا در آنگولار جی اس یافت می شود، ولی قصد نداریم که در این مقاله همه ی آن ها را مورد بررسی قرار دهیم.

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

اولین نسخه ی پایدار آنگولار ۲ در ۲۰۱۶ عرضه گردید و از آن زمان تاکنون، آنگولار جی اس شروع به از دست دادن محبوبیتش کرد و نسخه ی جدید جای ان را در دل ها گرفت. یکی از اصلی ترین قابلیت های آنگولار ۲ این بود که می توان از آن برای پلتفرم های متعددی بهره گرفت: وب، موبایل و دسکتاپ (در حالی که آنگولار جی اس پشتیبانی از موبایل را نداشت).

پس از آن داستان پیچیده تر شد و اواخر ۲۰۱۶ آنگولار ۴ عرضه گردید. شاید می پرسید که “عه، پس آنگولار ۳ چی شد؟”. سوال خود من هم همین بود اما ظاهرا نسخه ی ۳ هرگز عرضه نشد! چرا چنین اتفاقی افتاد؟ پاسخ این سوال را توسعه دهندگان در این پست بلاگ خود توضیح دادند و گفته اند که می خواهند نام نسخه ها را به شکلی معناگرا انتخاب کنند.

مطابق این قاعده، تغییر ورژن اصلی به معنای معرفی تغییرات مهم و اساسی است (مثلا تغییر ورژن اصلی از ۲٫۰٫۰ به ۳٫۰٫۰ . مشکل اینجا بود که مولفه ی روتر آنگولار پیش از آن وارد ورژن ۳ شده بود. بنابراین، برای جبران این ناهماهنگی تصمیم بر این شد که کلا نسخه ی سوم را نادیده بگیرند. خوشبختانه تغییر ورژن از آنگولار ۲ به ۴ بسیار قابل تحمل تر از تغییر از آنگولار جی اس، به آنگولار خالی بود، هرچند که هنوز هم بسیاری از توسعه دهندگان بخاطر این همه سردرگمی گیج شده بودند.

آنگولار ۵ در نوامبر ۲۰۱۷ عرضه گردید که با نسخه های قبلی نیز همخوانی و قابلیت همسازن سازی داشت. آنگولار ۶ نیز به زودی عرضه خواهد شد که امیدواریم قابلیت های جدیدی با خود همراه کند.

معرفی آنگولار: نقاط قوت

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

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

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

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

مولفه ها مجزا شده اند. آنگولار تلاش کرد تا وابستگی بین مولفه های اپلیکیشن را از بین ببرد. تزریق به روش NodeJS رخ می دهد و مولفه های مختلف را به سادگی می توانید جایگزین کنید.

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

قلب آن آزمایش است. آنگولار به طور کامل تست شده و از آزمایش نقطه به نقطه پیروی می کند که این کار را با ابزارهایی نظیر Jasmine و Protractor به انجام می رساند.

آنگولار آماده به کار در موبایل و دسکتاپ است. بدین معنا که فریمورک شما چند پلتفورم را پشتیبانی می کند.

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

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

معرفی آنگولار: پیچیدگی های آنگولار

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

  • توصیه می شود که اپ های آنگولاری را با Typescript بنویسید، بنابراین باید آن را به خوبی بفهمید. همچنین این امکان وجود دارد که برای نوشتن آن ها از کدهای جاوااسکریپت مدرن استفاده کنید، هرچند که افراد زیادی از این روش استفاده نمی کنند.
  • Typescript زیر مجموعه ی جاوااسکریپت است، بنابراین لازم است که کار کردن با آن برایتان راحت باشد.
  • ایده ی خوب دیگر این است که بخوبی CLI آنگولار را درک کنید تا پروسه ی توسعه را تسریع ببخشید.
  • مدیر بسته ی نود (npm)، به طور گسترده ای برای نصب خود آنگولار و سایر مولفه های آن مورد استفاده قرار می گیرد، بنابراین باید کار با آن برایتان راحت باشد.
  • همچنین لازم است که با اجرا کننده ی وظیفه ای نظیر Gulp یا Grunt تا حدودی آشنا باشید تا طیف وسیعی از کارهای مختلف را با سادگی و سرعت بیشتر به انجام برسانید.
  • استفاده از فشرده ساز ها (نظیر UglifyJS) و باندلر ها (نظیر Webpack) نیز این روزها خیلی فراگیر شده است.
  • حین توسعه ی اپ، خیلی مهم است که کد را دیباگ کنید، بنابراین باید با ابزار دیباگ کردن نظیر Augury آشنا باشید.
  • البته، خیلی مهم است که اپلیکیشن های آنگولار تست شوند که این موضوع به خودی خود، بسیار پیچیده می تواند باشد. یکی از محبوب ترین ابزارهای تست Jamine (که فریمورکی برای تست است) می باشد. هم چنین Protractor (که از تست نقطه به نقطه بهره می برد) نیز در دسترس می باشد.

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

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

جمع بندی

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