آموزش انگولار 6 ( شامل انگولار ۲ تا 6) + پروژه محور

دوره آموزش انگولار (Angular) به زبان فارسی به شما کمک می‌کند تا یک فرانتندکار (Frontend) حرفه‌ای شوید. اگر چنانچه هیچ دانشی درباره فریم ورک‌های جاوا اسکریپت ندارید اصلا نگران نباشید چون در این دوره شما را از یک فرد کاملا مبتدی به یک برنامه نویس حرفه‌ای در این زمینه تبدیل می‌کنیم.

مخاطب دوره آموزش انگولار کیست؟

• تمام افراد مبتدی و همچنین توسعه‌دهندگان حرفه‌ای و پیشرفته که علاقه‌مند به یادگیری یک فریم ورک سطح بالا هستند
• این دوره برای همه‌ی علاقه‌مندان به طراحی وب سمت کاربر (Frontend) و فول استک‌ها (Full Stack) مناسب است.

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

پیش‌نیازهای دوره آموزش انگولار (Angular)

• نیازی به دانش انگولار ‍1 یا انگولار 2 و 4 و 5 نیست
• یادگیری اصول اولیه زبان HTML و CSS (در سطح مقدماتی)
• دانش اولیه در ارتباط با زبان تایپ اسکریپت (TypeScript) - برای یادگیری اینجا کلیک کنید
• دانش اولیه و مقدماتی درباره زبان جاوا اسکریپت (JavaScript)

شرح دوره

این دوره به آموزش انگولار 6 به زبان فارسی می‌پردازد و در طی فصول متفاوت شما را از یک فرد کاملا مبتدی به یک برنامه نویس حرفه‌ای سمت کاربر (Frontend) تبدیل می‌کند. این آموزش فارسی به گونه‌ای ارائه شده است که از نصب تا راه اندازی انگولار 6 روی سرور واقعی را‌ به شما آموزش می‌دهد. هر آنچه که درباره کامپوننت‌های انگولار، دستورها، سرویس‌ها، فرم‌ها، دسترسی Http، احزار هویت (Authentication)، بهینه‌سازی نرم افزار انگولاری و ... لازم باشد به شما ارائه می‌دهیم. به طور کلی شما در طی این دوره یاد می‌گیرید که چگونه یک وب اپلیکیشن مشابه موبایل در سطح اینترنت راه اندازی کرده تا کاربران از تجربه کاربری فوق العاده‌ای بهره ببرند.

این دوره به شما تمام اصول مرتبط با ماژول‌ها، مسیریابی (Routing)، ارتباط با api، ارتباط دو طرفه (DataBinding) و ... را به زبان بسیار ساده آموزش می‌دهد. به زبان عامیانه اینجا شما به صورت کامل غواصی در عمق انگولار رو یاد می‌گیرید. :)

ما در دوره آموزش انگولار 6 به سوالات زیر پاسخ خواهیم داد:

• معماری انگولار 2، 4 یا 5 یا 6 چگونه است؟
• چطور از زبان تایپ اسکریپت (TypeScript) برای آموزش انگولار 5 استفاده کنم؟
• دستورها (Directives) و کامپوننت‌ها (Components) چی هستند؟
• ارتباط دو طرفه داده‌ای (Two-Way-Databinding) چیست و چگونه کار می‌کند؟
• مسیریابی (Routing) و ناوبری (Navigation) را چطوری باید انجام داد؟
• پایپ (Pipe) در انگولار چه مفهومی دارد؟
• چطور انگولار را به سرور api متصل کنم؟
• تزریق وابستگی در انگولار چیست و چه کاربردی دارد؟
• چگونه از ماژول‌ها در انگولار استفاده کنم؟
• چطور نرم افزار‌های حجیم انگولاری را بهینه کنم تا سرعت وب سایت افزایش پیدا کند؟
• ساخت یک پروژه از ۰ تا ۱۰۰ وب سایت انگولاری
• و ...

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

انگولار یکی از مدرن‌ترین فریم‌ورک‌های فرانتند (Frontend) بوده که هر برنامه‌نویس سمت کاربر باید یکی از این فریم‌ورک‌ها را به صورت حرفه‌ای یاد بگیرد. این فریم ورک قابلیت تولید وب اپلیکیشن‌های بسیار قدرتمند و پیچیده را فراهم می‌کند تا تجربه‌ی کاربری (User Experiences) را افزایش داده و تعامل کاربر با وب سایت طراحی شده را بسیار لذت بخش کند. تمام اصولی که باید درباره این فریم‌ورک بدانید درون این دوره گنجانده شده است. ما به شما راه ساخت سریع وب سایت‌های انگولاری را می‌آموزیم.

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

و اما سوال خیلی مهم!

چرا انگولار؟

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

در حال حاضر انگولار 6 به عنوان آخرین نسخه این فریم‌ورک معرفی شده است. البته لازم به ذکر است افرادی که با انگولار 2 یا 4 یا 5 کار می‌کنند با استفاده از این آموزش می‌توانند سطح معلومات خود را بسیار حرفه‌ای تر کنند. زیرا تفاوت‌های بین ورژن 2، 4 و 5 و 6 بسیار جزئی بوده ولی کلیات مباحث همان است.

سرفصل‌های این دوره

مقدمه، نصب و راه اندازی اولیه

• معرفی دوره و مدرس
• انگولار (Angular) چیست؟
• تفاوت بین Angularjs و Angular 2 و Angular 4 و Angular 5 و Angular 6
• ساخت اولین پروژه
• ویرایش اولین پروژه
• برنامه‌ریزی دوره
• معرفی ابزار قدرتمند Angular CLI
• زبان تایپ اسکریپت (TypeScript) چیست؟
• نصب و راه‌اندازی بوت استراپ روی انگولار

شرح مختصر مفاهیم بنیادی

• معرفی ماژول‌ها (Modules)
• توضیح نحوه‌ی کارکرد نرم‌افزارهای انگولاری
• معرفی کامپوننت‌ها و ساخت یک کامپوننت جدید
• درک مفاهیم ماژول‌ها و تعریف کامپوننت‌ها
• تعریف کردن کامپوننت‌های دلخواه با استفاده از CLI
• کار با قالب‌های HTML در کامپوننت‌ها
• کار با استایل‌ها در کامپوننت‌ها
• درک عمیق درباره سلکتورهای (معرف‌های) کامپوننت‌ها
• معرفی ارتباط داده‌ای یا Databinding
• معرفی روش ارتباط داده‌ای String Interpolation
• معرفی Property Binding
• مقایسه String Interpolation و Property Binding
• معرفی Event Binding
• ارسال داده‌ها با استفاده از Event Binding
• معرفی ارتباط داده‌ای دو طرفه (Two-Way Databinding)
• ترکیب روش‌های ارتباط داده‌ای با فرم‌ها
• معرفی دستورها (Directives)
• معرفی و استفاده دستورهای ساختاری ngIf و ngIf Else
• معرفی دستورهای صفتی ngStyle
• افزودن کلاس‌های CSS پویا به تگ‌ها با دستور صفتی ngClass
• آموزش نحوه‌ی استفاده از دستور ساختاری ngFor

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت اول)

• معرفی پروژه
• برنامه‌ریزی و طراحی پروژه
• نصب نرم‌افزار انگولار و وابستگی‌ها
• ایجاد کامپوننت‌های مورد نیاز
• استفاده از کامپوننت‌ها
• افزودن منوی اصلی فروشگاه
• معرفی و ایجاد مدل‌ها
• نمایش لیست محصولات
• نمایش جزئیات محصول
• نمایش لیست خرید
• ویرایش لیست خرید

خطایابی

• معرفی و آموزش خطایابی نرم‌افزارهای انگولاری
• خطایابی نرم افزارهای انگولاری با استفاده از مرورگرها
• معرفی، نصب و آموزش استفاده از ابزار Augury

سطح پیشرفته کامپوننت‌ها

• معرفی ماژول‌ها
• جداسازی نرم‌افزار به واحد‌های کوچک کامپوننت‌ها
• معرفی عمیق Property Binding و Event Binding
• تعریف یک Property Binding دلخواه و افزودن نام مستعار به آن
• تعریف یک Event Binding دلخواه و معرفی EventEmiter
• معرفی مفاهیم کپسوله‌سازی در انگولار 
• استفاده از لوکال رفرنس‌ها (Local Reference) در قالب HTML
• دسترسی به تگ‌های قالب HTML و DOM توسط ViewChild@
• معرفی ng-content و نحوه‌ی استفاده به آن
• یادگیری چرخه حیات انگولار یا Lifecycle
• معرفی هوک‌های (Hooks) انگولار و نحوه‌ی تعامل آنها با قالب
• دسترسی به ng-content با استفاده از ContentChild@

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت دوم)

• معرفی کامپوننت‌ها و روش ارتباط داده‌ای در پروژه
• افزودن منو با استفاده از Event Binding و دستور ngIf
• ارسال داده‌های محصولات با استفاده از Property Binding
• ارسال داده‌های ترکیبی با استفاده از ngModel
• افزودن اطلاعات به لیست خرید توسط کاربر

سطح پیشرفته دستورها (Directives)

• معرفی ماژول‌ها
• معرفی دستورهای ساختاری ngFor و ngIf به صورت عمیق
• معرفی دستورهای صفتی ngClass و ngStyle به صورت عمیق
• ساخت دستورهای صفتی 
• استفاده از HostListener برای گوش دادن به رویدادها
• اتصال داده‌ها به دستورهای صفتی
• پاسخ به سوال: در پشت صحنه دستورها چه اتفاقی می‌افتد؟
• درک دستور ngSwitch

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت سوم)

• افزودن دستورها به پروژه

معرفی سرویس‌ها و تزریق وابستگی

• معرفی ماژول‌های مورد نیاز
• چرا باید از سرویس‌ها استفاده کنیم؟
• ساخت سرویس ورود کاربران
• تزریق سرور ورود کاربران به کامپوننت
• ساخت سرویس داده‌ها
• درک مفهوم تزریق وابستگی
• تزریق یک سرویس درون سرویس‌های دیگر
• استفاده از یک سرویس برای چندین کامپوننت

پروژه ساخت وب سایت فروشگاه اینترنتی (قسمت چهارم)

• معرفی سرویس‌ها
• نصب سرویس‌ها
• مدیریت سرویس‌های محصولات و کاربران
• افزودن سرویس‌ها به پروژه جهت حذف و یا اضافه کردن سبد خرید

مسیردهی (Routing)

• معرفی ماژول‌های موردنیاز
• چرا باید از مسیردهی استفاده کنیم؟
• راه‌اندازی مسیر‌های اولیه و بارگذاری مسیرها
• اختصاص دادن لینک‌ها به مسیرها
• درک مفهوم مسیرهای ناوبری
• استایل دادن به مسیرهای فعال
• ناوبری (Navigation) داینامیک و پویا بر اساس ID 
• استفاده از مسیرهای نسبی (Relative Path) در برنامه‌نویسی ناوبری
• ارسال پارامتر به مسیرها
• بررسی پارامترها در مسیرها
• ارسال پارامترهای کوئری و فرگمنت‌ها (#)
• بازیابی و تحلیل پارامترهای کوئری و فرگمنت‌ها (#)
• راه‌اندازی مسیرهای تودر تو
• نحوه ریدایرکت کردن (Redirecting) و Wildcard در مسیرها
• معرفی Guards یا محافظان مسیرها
• حفاظت از برخی مسیرها با استفاده از canActivate
• حفاظت از مسیرهای فرزند تو در تو با استفاده از canActiveChild
• راه اندازی سرویس Auth برای احراز هویت
• کنترل دسترسی به مسیر با استفاده از canDeactivate
• ارسال داده‌های ثابت به مسیرها
• درک استراتژی موقعیت و مکان مسیرها در انگولار

پروژه وب سایت فروشگاه اینترنتی (قسمت پنجم)

• برنامه‌ریزی و طراحی مسیرها
• نصب مسیرها
• اضافه کردن ناوبری بین مسیرها
• افزودن استایل به صفحات فعال
• حل کردن مشکل بارگذاری مجدد صفحات
• استفاده از مسیرهای فرزند
• اضافه کردن مسیرهای تو در تو
• تنظیم پارامترهای مسیرها
• ارسال پارامترهای داینامیک به مسیرها
• افزودن مسیرهای ویرایش محصول

مشاهده‌کننده و مشاهده‌گر (Observable و Observer)

• معرفی ماژول‌ها
• آنالیز و تحلیل مشاهده‌کننده‌های داخلی انگولار
• ساخت اولین مشاهده‌کننده (Observable) در انگولار
• ساخت و استفاده از Observableهای دلخواه از صفر تا صد
• استفاده از دستور Subscribe و Unsubscribe
• معرفی و استفاده از Subjectها برای ارسال داده
• درک عملگرهای موجود در مشاهده کننده‌ها یا Observables

پروژه وب سایت فروشگاه اینترنتی (قسمت ششم)

• بهبود عملکرد سرویس‌ها با استفاده از Observablesها و Subjectها

کار کردن با فرم‌ها در انگولار

• معرفی ماژول فرم‌ها
• مقایسه رویکرد Template-Driven یا TD و Reactive
• تعریف یک مثال از فرم‌ها
• ساخت یک فرم ثبت نام و کنترل آن با رویکرد TD
• ثبت اطلاعات درون فرم با رویکرد TD
• درک مفهوم موقعیت فرم‌ها با رویکرد TD
• دسترسی به فرم‌ها با استفاده از ViewChild@ با رویکرد TD
• افزودن اعتبارسنجی به ورودیهای فرم با رویکرد TD
• نمایش خطاهای اعتبارسنجی با رویکرد TD
• استفاده از ngModel‌در فرم‌ها و Two-way Databinding با رویکرد TD
• گروه‌بندی فرم‌ها با رویکرد TD
• کار کردن با دکمه‌های رادیویی با رویکرد TD
• بروزرسانی اطلاعات یک فرم با رویکرد TD
• استفاده از داده‌های فرم‌ها با رویکرد TD
• بازنویسی کردن و پاک کردن اطلاعات موجود در فرم‌ها با رویکرد TD
• معرفی رویکرد Reactive
• نصب رویکرد Reactive
• ساخت یک فرم با رویکرد Reactive
• تنظیم قالب HTML و فرم با استفاده از رویکرد Reactive
• افزودن اعتبارسنجی با رویکرد Reactive
• دستیابی به کنترل‌ها با رویکرد Reactive
• گروه‌بندی فرم‌ها با رویکرد Reactive
• آرایه‌های فرم‌ها یا FormArray در رویکرد Reactive
• ساخت اعتبارسنجی‌های دلخواه با رویکرد Reactive
• نمایش خطاهای فرم‌ها با رویکرد Reactive
• ساخت اعتبارسنجی‌های غیرهمزمان (Async) با رویکرد Reactive
• بروزرسانی اطلاعات فرم‌ها با رویکرد Reactive

پروژه وب سایت فروشگاه اینترنتی (قسمت هفتم)

• افزودن فرم‌ها به محصولات با رویکرد TD
• افزودن اعتبارسنجی‌ها به فرم‌ها
• بارگذاری اطلاعات لیست خرید درون فرم
• ویرایش فرم محصولات
• بازنویسی فرم‌ها
• اجازه دادن به کاربر جهت حذف اطلاعات درون فرم‌ها
• کار کردن با رویکرد Reactive در بخشی از پروژه
• اعتبارسنجی ورودی‌های کاربران
• ثبت اطلاعات

معرفی Pipeها

• معرفی و مقدمه‌ای بر Pipeها در انگولار
• استفاده از Pipeها
• پارامترگذاری کردن Pipeها
• ساخت Pipe‌ دلخواه
• ساخت یک فیلتر برای جستجو
• درک Pipeهای غیرهمزمان یا async

درخواست‌های پروتکل HTTP و HttpClient

• معرفی پروتکل Http و نحوه‌ی استفاده از آن در نرم‌افزارهای spa
• ارسال درخواست‌ POST
• افزودن هدر به درخواست‌ها
• ارسال درخواست GET
• ارسال درخواست PUT یا PATCH
• انتقال پاسخ‌ها به ساده‌ترین شکل ممکن با استفاده از عملگرهای Observable‌ مثل ()map
• استفاده از داده‌های بازگشتی
• شفاف سازی خطاهای Http
• استفاده از Pipe غیر همزمان (async) با متدهای Http

پروژه وب سایت فروشگاه اینترنتی (قسمت هشتم)

• اتصال پروژه به یک پایگاه داده
• دریافت اطلاعات از پایگاه داده
• نمایش اطلاعات بر اساس متدهای Http

احراز هویت (Authentication) و محافظت از مسیرها

• معرفی ماژول‌های احراز هویت
• نحوه‌ی کارکرد احزار هویت در انگولار
• ساخت صفحه عضویت کاربران و مسیردهی آن
• استفاده از توکن
• ارسال توکن جهت بررسی احزار هویت و اعلام وضعیت کاربر
• افزدون دکمه خروج
• محافظت از مسیرها و هدایت آنها به صفحات مشخص

بهینه‌سازی نرم‌افزار و ماژول‌ها

• معرفی بهینه‌سازی
• ایده‌ی موجود در ماژول‌ها
• درک App Module
• درک ویژگی‌های ماژول‌ها
• ساخت ماژول‌های مشترک
• ساخت ماژول Auth
• درک مفهوم Lazy Loading در انگولار
• افزودن ماژول‌های Lazy Loading به پروژه فروشگاه اینترنتی
• آموزش نحوه کارکرد ماژول‌ها و تعامل آنها با سرویس‌ها
• معرفی AoT‌ در انگولار و نحوه‌ی کار با آن

بارگذاری نرم افزار در اینترنت

• معرفی ماژول‌های موردنیاز
• ایجاد نسخه پروداکشن (محصول نهایی) جهت بارگذاری در اینترنت و هاست واقعی

انیمیشن در انگولار

• معرفی انیمیشن‌ها در انگولار
• نصب و راه‌اندازی اولین پروژه دارای انیمیشن
• معرفی اینیمیشن‌های Triggers
• تغییر موقعیت انیمیشن‌ها
• استفاده از Transitionsها
• استفاده از Transitionsها در سطح پیشرفته
• استفاده از موقعیت viod
• استفاده از Keyframeها برای انیمیشن‌سازی
• گروه‌بندی Transitionsها
• استفاده از کال بک‌ها (Callbacks) در انیمیشن‌ها

معرفی Unit Testing در انگولار

• معرفی Unit Testing
• چرا باید از Unit Testing استفاده کنیم؟
• تحلیل و آزمایش نرم‌افزار تولید شده با اسفتاده از CLI
• افزودن یک کامپوننت برای تست و آزمایش
• تست کردن وابستگی‌ها مانند کامپوننت‌ها و سرویس‌ها
• شبیه‌سازی کردن عملیات‌های غیرهمزمان (Async)
• استفاده از دستور fakeAsunc و tick

آموزش سئو انگولار با انگولار یونیورسال (Angular Universal)

• معرفی سئو در انگولار
• چرا باید فریم‌ورک‌های سمت فرانتند رو سئو کنیم؟
• ایجاد main.server.ts
• کار با tsconfig
• کار کردن با SSR یا Server-Side-Rendering از طریق angular.cli.json
• ساخت سرور با Nodejs
• استفاده از Webpack برای بسته‌بندی داده‌ها

ویژگی های جدید انگولار 6

• معرفی انگولار 6 و نحوه آپدیت فایل های انگولار 5
• آشنایی با ساختار ng update
• معرفی موتور رندر Ivy Renderer
• آپدیت انگولار 5 به 6 (معرفی عملگرها و تغییرات RxJs 6)
• معرفی RxJs6
• تغییرات مربوط به HttpClient
• تغییرات مربوط به قالب HTML شامل ng-template
• معرفی Angular Element
• آموزش ساخت یک Element در انگولار 6

انگولار (که پر استفاده ترین نسخه های آن "انگولار 6" یا "انگولار 5" است) یک فریم ورک سمت کاربر (front-end) رایگان و متن باز می باشد که توسط تیم توسعه انگولار در شرکت گوگل به زبان تایپ اسکریپت برنامه نویسی شده است. در واقع فریم ورک انگولار یک بازنویسی کامل از فریم ورک انگولار جی اس می‌ باشد.

تفاوت بین انگولار و انگولار جی اس

انگولار یک بازنویسی کامل و از صفر فریم ورک انگولار جی اس می باشد:

• فریم ورک انگولار واژه‌هایی مانند اسکوپ (scope) یا کنترلر (controller) ندارد. به جای این واژه‌ها، الگوهایی مانند کامپوننت‌ ها، مدل‌ ها و سرویس‌ ها را در اختیار می‌ گذارد.
• انگولار نگارش (syntax) متفاوتی داشته و بیشتر روی علامت "{{ }}" متمرکز است. علامت "{{ }}" برای ارتباط داده‌ای ویژگی ها و علامت "( )" برای ارتباط داده‌ای رویدادها مورد استفاده قرار می‌گیرد.
• ماژولار بودن - اکثر توابع در فریم ورک انگولار به صورت ماژول‌ها (modules) تعریف می‌شوند.
• انگولار با استفاده از زبان برنامه نویسی تایپ اسکریپت ایجاد شده است که در ادامه برخی از ویژگی‌های این زبان را مطرح خواهیم کرد:
  • این زبان از قابلیت شیءگرایی پشتیبانی می‌کند
  • داده‌های آن بر اساس نوع تعیین می‌شوند
• زبان برنامه نویسی تایپ اسکریپت از ساختار ES6 یا اکمااسکریپت ۶ پشتیبانی می‌کند و علاوه بر این با ساختار ES5 (جاوا اسکریپت) سازگار است. به عبارت دیگر از زبان برنامه نویسی جاوا اسکریپت نیز پشتیبانی می کند. از ویژگی‌های بارز زبان‌های ES6 می‌توان به موارد زیر اشاره کرد:
  • لامبدا
  • تکرارکننده ها
  • حلقه های for
  • ساختار نوشتاری مشابه زبان برنامه نویسی پایتون
• بارگذاری خودکار
• کلاس
• قالب های غیر همزمان (Asynchronous template)
• کنترلرها و $scope به ترتیب با کامپوننت‌ها (components) و دستورها (directives) جایگزین شده اند. در واقع یک کامپوننت به عنوان دستوری که دارای قالب html است شناخته می‌شود.
• بهره‌مندی از کال بک های تولید شده توسط RxJs.

تاریخچه

نام گذاری

در ابتدا نام‌گذاری انگولار بر اساس فریم ورک قبلی یعنی انگولار جی اس صورت گرفت. اولین نام این فریم ورک تحت عنوان "انگولار 2" معرفی شد. اما این نام گذاری باعث ایجاد سردرگمی در برنامه نویسان و توسعه دهندگان گردید. برای برطرف کردن این ابهام، تیم تصمیم گرفت که نام فریم ورک قبلی را انگولار جی اس و فریم ورک جدید را انگولار تعریف کند. یعنی از این به بعد انگولار 2 و 4 و 5 و 6 همگی زیرمجموعه‌ای از فریم ورک انگولار (بدون جی اس) هستند.

نسخه 2.0.0

در نسخه 2 انگولار تغییرهای بسیار زیادی بوجود آمد بگونه‌ای که دیگر مفاهیم فریم ورک قبلی هیچ معنایی پیدا نمی‌کردند. انگولار 2 در کنفرانس ng-Europe در سپتامبر ۲۰۱۴ رونمایی شد. سپس نسخه بتای آن در دسامبر ۲۰۱۵ در اختیار برنامه نویسان قرار گرفت.^[1] در نهایت در ۱۴ سپتامبر ۲۰۱۶ نسخه اصلی و نهایی انگولار 2 رونمایی گردید.

نسخه 4.0.0

در دسامبر سال ۲۰۱۶ انگولار 4 شروع به کار کرد. برای بسیاری از برنامه‌نویسان سوال پیش آمد که چرا انگولار 3 توزیع نشد. دلیل این امر عدم هماهنگی بخش مسیردهی (Router) در انگولار 3 بود. در نهایت با تکمیل ورژن 2، انگولار 4 در تاریخ ۲۳ مارس ۲۰۱۷ به صورت رسمی در اختیار توسعه دهندگان قرار گرفت. همچنین یک نسخه تحت عنوان انگولار 4.3 نیز معرفی گردید که در آن تغییرهای جزئی صورت گرفته بود.

برخی از تغییرهای انگولار 4.3 عبارتند از:

• معرفی یک ویژگی تحت عنوان HttpClient که درخواست‌های Http را به طرز شگفت انگیزی ساده‌سازی کرد.
• چرخه کارکرد (Lifecycle) جدیدی در سیستم مسیردهی انگولار معرفی شد که رویدادهایی مانند: GuardsCheckStart، GuardsCheckEnd، ResolveStart و ResolveEnd را در اختیار برنامه‌نویسان قرار داد.
• به طور موقت انیمیشن‌ها را غیر فعال کرد.

نسخه 5.0.0

تغییرهای نسبتا مناسبی در نسخه 5.0.0 انگولار اعمال شد که باعث بهینه شدن کدها و ارتباط بهتر انگولار با متریال (Material) گردید. این نسخه در تاریخ ۱ نوامبر سال ۲۰۱۷ ارائه شد.

نسخه 6.0.0

این نسخه از انگولار با تغییرات بسیار جزئی نسبت به انگولار 5 ارائه شده که در آن از نسخه 6 پلاگین RxJs استفاده شده است. همچنین در انگولار 6 یک مفهوم جدید به نام Angular Element استفاده می شود که این قابلیت را برای نرم افزار ایجاد می کند تا قالب HTML یک کامپوننت نه تنها در یک پروژه انگولار بلکه در باقی پروژه ها قابل استفاده باشد.

نسخه‌های آینده

با توجه به پیش‌بینی‌های شرکت گوگل نسخه 7 انگولار در ماه سپتامبر یا اکتبر سال ۲۰۱۸ رونمایی میشود.

یک بار خرید کن، یک عمر حرفه‌ای کدنویسی کن